jquery-plugins - Spectrum Colorpicker无法返回 "background-color: transparent"

Question

我正在创建一个简单的 HTML 编辑器，用户可以在其中编辑预制的 html block 。

其中一个 block 具有默认背景颜色，我使用 Spectrum 为用户提供更改它的机会。

由于已经有默认背景(由 css 给出)，所以当选择空时，我需要 Spectrum 返回“背景颜色:透明”，因此默认值将被覆盖，但 Spectrum 返回空字符串(？)。

有没有办法返回“背景颜色:透明”？

这是我当前的设置:

$('input[data-toggle="colorpicker"]').spectrum({

    showInput: true,
    allowEmpty: true,
    showButtons: true,
    clickoutFiresChange: true,
    preferredFormat: "name"

});

Answer 1

$("#colorpicker").spectrum({
                color: "white",
                showInput: true,
                className: "full-spectrum",
                showInitial: true,
                showPalette: true,
                showSelectionPalette: true,
                maxSelectionSize: 10,
                preferredFormat: "hex",
                localStorageKey: "spectrum.demo",
                clickoutFiresChange: true,
                palette: [["transparent"]], 
change: function(color) {
if(color._originalInput.a === 0) {
         color  = "transparent";
}else {color = color.toHexString();}
    $(this).val(color );
}

这是我的解决方案，用于检查所选颜色是否透明。由于我们无法将透明值转换为十六进制字符串，因此我们需要手动检查透明字符串。