Javascript 如何使用光谱颜色选择器隐藏某些颜色

Javascript 如何使用光谱颜色选择器隐藏某些颜色,javascript,jquery,css,color-picker,Javascript,Jquery,Css,Color Picker,我对使用Spectrum的颜色选择器很陌生。所以我查看了spectrum color picker提供的所有功能,但是我找不到一种方法来隐藏颜色选择器中的一些颜色,以便用户无法选择它们 例如,所有浅色:#FFFFFF、#F5F5F5、#FFFAFA、#F0FFF0、#F5FFFA、#F0FFFF、#F0F8FF、#f5f5e、#F5F5DC、#FDF5E6、#FFFAF0、#f0fff7、#faf5f0、#F5F5F5应在选择器中提供 有什么方法可以做到这一点吗?您不能在“颜色选择器”中删除颜色

我对使用Spectrum的颜色选择器很陌生。所以我查看了spectrum color picker提供的所有功能,但是我找不到一种方法来隐藏颜色选择器中的一些颜色,以便用户无法选择它们

例如,所有浅色:#FFFFFF、#F5F5F5、#FFFAFA、#F0FFF0、#F5FFFA、#F0FFFF、#F0F8FF、#f5f5e、#F5F5DC、#FDF5E6、#FFFAF0、#f0fff7、#faf5f0、#F5F5F5应在选择器中提供


有什么方法可以做到这一点吗?

您不能在“颜色选择器”中删除颜色,但可以在调色板中显示数量有限的颜色,用户可以使用这些颜色,而不包括用户无法选择的颜色

$("#togglePaletteOnly").spectrum({
    showPaletteOnly: true,
    togglePaletteOnly: true,
    togglePaletteMoreText: 'more',
    togglePaletteLessText: 'less',
    color: 'blanchedalmond',
    palette: [
        ["#000","#444","#666","#999","#ccc","#eee","#f3f3f3","#fff"],
        ["#f00","#f90","#ff0","#0f0","#0ff","#00f","#90f","#f0f"],
        ["#f4cccc","#fce5cd","#fff2cc","#d9ead3","#d0e0e3","#cfe2f3","#d9d2e9","#ead1dc"],
        ["#ea9999","#f9cb9c","#ffe599","#b6d7a8","#a2c4c9","#9fc5e8","#b4a7d6","#d5a6bd"],
        ["#e06666","#f6b26b","#ffd966","#93c47d","#76a5af","#6fa8dc","#8e7cc3","#c27ba0"],
        ["#c00","#e69138","#f1c232","#6aa84f","#45818e","#3d85c6","#674ea7","#a64d79"],
        ["#900","#b45f06","#bf9000","#38761d","#134f5c","#0b5394","#351c75","#741b47"],
        ["#600","#783f04","#7f6000","#274e13","#0c343d","#073763","#20124d","#4c1130"]
    ]
});

我希望它能有所帮助。

您必须使用受限颜色hax创建一个数组列表。 然后你应该使用
change
方法来处理。 和jquery
$.inArray()
函数来确定受限制的颜色

比如说

var banColor = ['#ffffff','#000000','#F0FFF0', '#F5FFFA', '#F0FFFF', '#F0F8FF', '#F8F8FF', '#FFF5E', '#F5F5DC', '#FDF5E6', '#FFFAF0', '#FFFFF0', '#FAEBD7', '#FAF0E6', '#FFF0F5'];

$(".example").spectrum({
    color: "#f00",
    change: function(color) {
        if( $.inArray( color.toHexString(), banColor ) >= 0 ){
            $("#basic-log").text("change called: " + color.toHexString() +' Is Not Allowed');
            // Reset your palate
        }
    }
});