带有 8 位十六进制的 Javascript 颜色选择器

Question

我正在寻找一个 javascript 颜色选择器，用它我可以设置颜色和不透明度。返回的字符串必须是 8 位长的十六进制值（不包括 #）。

已经看过了

• Farbtastic http://acko.net/blog/farbtastic-jquery-color-picker-plug-in/
• jPicker http://www.digitalmagicpro.com/jPicker/
• jQuery Minicolors http://labs.abeautifulsite.net/jquery-miniColors/

还有很多其他的。但它们都没有给我想要的东西，我不想弄乱修剪字符串等，因为颜色选择器必须在一页上实现大约 100 次才能实现换肤编辑器。

编辑

http://jscolor.com/

这就是使用 JSColor 的样子：

http://img707.imageshack.us/img707/3962/unbenannt3op.png

这是代码，我用它在我的 bean 中获取和设置十六进制代码：

<h:inputText styleClass="color {hash:true}"
             value="#{skinningBean.currentSkin.titleBar.backgroundColorStart}">
<a4j:ajax event="change" render="preview" />

除了缺少 alpha 值（最后 2 位数字）之外，这将工作得非常好。

Answer 1

我不知道为什么它不容易找到，但spectrum拥有我在颜色选择器中需要的一切。 （我一直在使用迷你颜色，直到找到光谱。）

我不知道它是否需要8位十六进制，但我知道它会接受4个参数rgba。 （它使用一个名为 tinycolor 的插件来进行所有颜色解析。）

Answer 2

我用 JavaScript 编写了一个公共领域的颜色选择器。根据您的要求，我现在添加了一项功能，以 RRGGBBAA 格式显示颜色，并带有十六进制组件。

• 演示：http://peteroupc.github.com/colorpicker/（查看示例“Alpha Color Picker（RRGGBBAA 格式）”。）
• 源代码：https://github.com/peteroupc/colorpicker

要启用此功能，请为文本框指定一个以“rgbahex_”开头的 ID，如下例所示：

<input type="text" value="ff0000ff" name="c2" id="rgbahex_c2">

这样做，文本框将转换为颜色选择器。不过，只有在页面完全加载之前输入框出现在 HTML 中时，它才会起作用。如果您在运行时创建颜色选择器，请使用以下 JavaScript 进行设置：

textbox.value="ff0000ff";
PDColorPicker.setColorPicker(textbox,{rgbahex:true});

setColorPicker

还将把文本框转换为颜色选择器。

---

我更新了颜色选择器以添加颜色格式 AARRGBB。在上面的示例中使用

argbhex

代替

rgbahex

。

您还可以使用“rgbahex_”、“argbhex_”等开头文本框的类名，而不是ID来打开，将文本框变成颜色选择器。我认为这对应于 XML 中的 styleClass

 属性。

Answer 3

您也许可以通过定义一个“修剪字符串并执行此操作”函数来管理它，该函数只需实现一次，然后在任何地方调用它即可。

Answer 4

我建议使用 Scott 建议的光谱颜色选择器，但是你可以从中获取 RGB 值，并使用此属性：

background: rgba(132,182,19,.5); 这样，它将设置当前div的背景，并且它会像你想要的那样不透明（所以你必须找到一种方法来给它你想要的不透明度），但至少你会得到来自选择器的颜色值。如果您想了解有关 IE 使用 rgba 的回退和解决方法的更多信息，请参阅

CSS Tricks。

更新：

如果您必须使用十六进制值，请尝试这样的操作：

http://jsfiddle.net/WzGG6/1/

Answer 5

我一直在我的项目中使用这个组件：

https://jsuites.net/docs/color-picker 很有帮助！