Question

我使用jPicker插件从选择器中获取颜色。我以这种方式创建元素：

           $(function(){
                $('#txtBackgroundColor').jPicker(
                {
                    color:
                    {
                        mode: 'h', // acceptable values "h" (hue), "s" (saturation), "v" (brightness), "r" (red), "g" (green), "b" (blue), "a" (alpha)
                        active: new $.jPicker.Color({ hex: 'eaeaea' }), // accepts any declared jPicker.Color object or hex string WITH OR WITHOUT '#'
                    },
                    window:
                    {
                        position:
                        {
                            x: 'screenCenter', // acceptable values "left", "center", "right", "screenCenter", or relative px value
                            y: '200px', // acceptable values "top", "bottom", "center", or relative px value
                        },
                        expandable: true
                    },
                },

            });

当我点击一个按钮时，我想设置该jpicker的活动颜色。我在文档中看到了这一行：

$('#update').click(function(){
    $.jPicker.List[0].color.active.val('hex', 'e2ddcf', this); 
});

但问题是我有多个jPicker，并且我不知道List的索引，例如，有没有办法按id而不是索引List设置jPicker颜色？

由于

Answer 1

设置值

var control= $('#txtBackgroundColor')
var colorPicked = '#e2ddcf';
control.jPicker({
   color: { active: colorPicked}
});
control[0].color.active.val('hex', colorPicked);
control.val(colorPicked.replace("#", ""));

根据您的情况，上面的某些行可能无关紧要。

查找ID 如果：

$('#txtBackgroundColor')

是不正确的查找带有jPicker类的跨度，就像这样

<span class="jPicker">

就在上面，应该有一个显示样式为none且带有ID值的输入。在上面的例子中使用那个。

Answer 2

你的语法不对。修正了它。

您可以使用.each（）来定位每个元素：

$(function() {
$('#txtBackgroundColor').each(function() {
    $(this).jPicker({
        color: {
            mode: 'h', // acceptable values "h" (hue), "s" (saturation), "v" (brightness), "r" (red), "g" (green), "b" (blue), "a" (alpha)
            active: new $.jPicker.Color({
                hex: 'eaeaea'
            }), // accepts any declared jPicker.Color object or hex string WITH OR WITHOUT '#'
        },
        window: {
            position: {
                x: 'screenCenter', // acceptable values "left", "center", "right", "screenCenter", or relative px value
                y: '200px', // acceptable values "top", "bottom", "center", or relative px value
            },
            expandable: true
        },
    })
});

}）;

jPicker设置颜色

2 个答案: