0

私はこのjQueryカラーピッカーをCMSテーマクリエーターに使用しています: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を渡す1つの関数があると便利です。これは可能ですか?

これは機能しませんでした:

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 に答える