Spectrum.js將顏色選擇器重置爲「空白」

Question

我使用spectrum.js作爲顏色選擇器，我非常喜歡它。有兩件事我不知道該怎麼做。我的配置是這樣的：

$("#myColorThing").spectrum({ 
    preferredFormat: "rgb", 
    showPaletteOnly: true, 
    showPalette: true, 
    hideAfterPaletteSelect: true, 
    color: "", 
    showInput: true, 
    allowEmpty: true, 
    palette: [ 
     [ 
      "rgb(000,000,128)", 
      "rgb(000,000,255)", 
      "rgb(000,128,000)", 
      "rgb(000,128,128)", 
      "rgb(000,128,255)" 
     ], 
     [...],... 
    ] 
}); 

我的問題是：

1. 我只使用了palette選項和礦山有5行的顏色5周的cols的。呈現的小部件看起來有點像一個下拉式的「透明」/方格圖像，意味着沒有選擇。精細。如果我激活小部件並選擇一種顏色，是否有辦法得到一個解決辦法？將小部件設置回無選擇狀態？
2. 與＃1相關。是否有可能在palette中將該「透明」/方格圖像作爲「顏色」選項，以便選擇它以清除後備輸入字段的值？

Answer 1

我找到了問題1的解決方法。我重新編寫了一下我的代碼。我創建了spectrum小部件所附的基本html input元素。然後，我添加了一個，其onClick動作執行...spectrum("destroy")，然後重新創建頻譜實例。一拉：

基本HTML：

<div id='colorDiv' class='form-group'> 
    <label for='myColorThing'>Event Color</label> 
    <input type='text' name='myColorThing' id='myColorThing'> 
    <button id='defaultColor' class='btn btn-sm btn-default'>Default Color</button> 
</div> 

JS常規做重置法寶：

$("#defaultColor").on("click", function() { 
    resetColorPicker(); 
}); 

function resetColorPicker() { 
    $("#myColorThing").spectrum("destroy"); 
    $("#myColorThing").val(""); 

    $("#myColorThing").spectrum({ 
     preferredFormat: "rgb", 
     showPaletteOnly: true, 
     showPalette: true, 
     hideAfterPaletteSelect: true, 
     color: "", 
     showInput: true, 
     allowEmpty: true, 
     palette: [ 
      [ 
       "rgb(000,000,128)", 
       "rgb(000,000,255)", 
       "rgb(000,128,000)", 
       "rgb(000,128,128)", 
       "rgb(000,128,255)" 
      ], 
      [...],... 
     ] 
    }); 
}