0

我正在为 CMS 主题创建者使用这个 jQuery 颜色选择器:http ://www.eyecon.ro/colorpicker/

它们目前为每个颜色选择器设置如下:

<div class="colorSelector" id="colorSelector3"><div style="background-color: #0000ff"></div></div>

有了这个用于javascript:

$('#colorSelector3').ColorPicker({
color: '#0000ff',
onShow: function (colpkr) {
    $(colpkr).fadeIn(500);
    return false;
},
onHide: function (colpkr) {
    $(colpkr).fadeOut(500);
    return false;
},
onChange: function (hsb, hex, rgb) {
    $('#colaAlpha a').css('color', '#' + hex);
    $('#colorSelector3 div').css('backgroundColor', '#' + hex);
}

});

问题是我需要创建大量的颜色选择器,如果有一个函数可以传入选择器的 id 和要更改的元素的 id,那就太好了。这可能吗?

这没有用:

function colorPickMulti(itemid, cp){
$(cp).ColorPicker({
color: '#0000ff',
onShow: function (colpkr) {
    $(colpkr).fadeIn(500);
    return false;
},
onHide: function (colpkr) {
    $(colpkr).fadeOut(500);
    return false;
},
onChange: function (hsb, hex, rgb) {
$(itemid).css('color', '#' + hex);
$(cp + ' div').css('backgroundColor', '#' + hex);
}
});
}

我可以以某种方式动态创建函数吗?任何帮助都会很棒!谢谢。

4

1 回答 1

3
<div class="colorSelector" id="colorSelector3"><div style="background-color: #0000ff"></div></div>
<div class="colorSelector" id="colorSelector4"><div style="background-color: #0000ff"></div></div>

<script type="text/javascript">
function colorPickMulti(itemid, cp){
    $(cp).ColorPicker({
        color: '#0000ff',
        onShow: function (colpkr) {
            $(colpkr).fadeIn(500);
            return false;
        },
        onHide: function (colpkr) {
            $(colpkr).fadeOut(500);
            return false;
        },
        onChange: function (hsb, hex, rgb) {
            $(itemid).css('color', '#' + hex);
            $(cp + ' div').css('backgroundColor', '#' + hex);
        }
    });
}

$('#colorSelector3').click(function(){
    colorPickMulti('itemid', 'cp');
});

$('#colorSelector4').click(function(){
    colorPickMulti('itemid', 'cp');
});

</script>
于 2012-09-10T15:47:17.707 回答