質問

I'm using jQuery Spectrum as a color picker in my app (http://bgrins.github.io/spectrum). I can't figure out how to set the palette after the plugin has been initialized.

This how I create a palette when it's first initialized:

$("#showPalette").spectrum({
    showPalette: true,
    palette: [
        ['black', 'white', 'blanchedalmond'],
        ['rgb(255, 128, 0);', 'hsv 100 70 50', 'lightyellow']
    ]
});

How could I update the palette to a new selection of colors without destroying and re-initializing?

Thanks for any help.

役に立ちましたか?

解決

Saw that no one has responded to this yet so I'd thought I give it a try. The short answer is that it is possible to change almost anything once it is in the DOM. I created a simple demo here to show the color palette initialized and then dynamically added (and removed) a color to the palette.

Hope this helps.

jsfiddle code demo

$("#colorTest").spectrum({
    showPalette: true,
    flat: true,
    palette: [
        ['black', 'white', 'blanchedalmond'],
        ['rgb(255, 128, 0);', 'hsv 100 70 50', 'lightyellow']
    ]
});

$('#add').click( function() {
    var newColor = "<span id='colorRed' title='red' data-color='red' class='sp-thumb-el sp-thumb-light'><sp class='sp-thumb-inner' style='background-color: red;'></span></span>";

    if ( $("[data-color='red']").length == 0 ) {
       $(newColor).appendTo('.sp-palette-row-0');
    }
});

$('#remove').click( function() {
   $('#colorRed').remove();
});
ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top