Colorpicker使用jquery插件

时间:2011-12-16 10:15:03

标签: jquery jquery-ui jquery-plugins

我正在尝试设计一个带有颜色选择器的页面来设置文本的前景色和背景色。我通过一个看起来很吸引人的颜色选择器的演示来试图在弹出窗口中实现相同的功能。我想知道这里是否有人熟悉下面链接中描述的颜色选择器:

http://www.eyecon.ro/colorpicker/

查询是“是否可以将此插件绑定到具有不同名称的div?”如果是,请随时提供帮助..

2 个答案:

答案 0 :(得分:3)

该页面包含以下代码段:

$('#colorpickerHolder').ColorPicker({flat: true});

第一部分是标准的jQuery选择器,所以你应该用noproblem替换div的ID:

<div id="myPicker"></div>

// snip

$('#myPicker').ColorPIcker({flat: true});

在网站的调用页面上,他们有这个,这表明它可能适用于输入字段?我已经下载了包,没有更好的说明。您可能需要深入了解源代码以了解其工作原理。

  

调用代码您所要做的就是选择a中的元素   jQuery方式并调用插件。 $( '输入')的ColorPicker(选项);

答案 1 :(得分:1)

试试这个。

$(document).ready(function() {
    $('#FieldID').ColorPicker({
    onSubmit: function(hsb, hex, rgb, el) {
            $(el).val(hex);
    $(el).ColorPickerHide();
    },
    onBeforeShow: function () {
        $(this).ColorPickerSetColor(this.value);
    }
    }).bind('keyup', function(){
        $(this).ColorPickerSetColor(this.value);
    })
});

您可以将#FieldID替换为逗号分隔的字段ID列表(前缀为#(sharp))和/或类(前缀为。(点))和/或任何CSS选择器。