Question

我刚刚发现了jscolor颜色选择器库，我正在尝试使用它来创建无序列表，这些列表可以编辑，并且每个列表元素都有一个与之关联的颜色选择器按钮。这样做需要通过DOM创建一个带有Javascript的新按钮，而不是html文件。这是通过以下代码段完成的：

var newPlayerColor = document.getElementById('colorPicker').value;
    var input = document.createElement('INPUT');
    var newColorButton = new jscolor(input);
    alert(newColorButton.valueElement);
    input.style.backgroundColor = newPlayerColor;
    input.style.height = '20px';
    input.style.width = '20px';
    input.style.cursor = 'pointer';
    newDiv.appendChild(input);

上面的代码工作正常，但它确实将内部显示颜色十六进制值的按钮保留为文本（变量的命名还不是semamtic，所以请忽略）我想删除此文本只留下颜色（仍然可以单击并用作颜色选择器）。我找不到jscolor库的任何严格文档，但主页（http://jscolor.com/examples/）确实包含大量示例。

其中一个示例具有我正在寻找的确切功能

<button
    class="jscolor {valueElement:null,value:'66ccff'}"
    style="width:50px; height:20px;"></button>

问题是这是从html页面完成的，我不清楚如何将valueElement设置为null（这似乎是在做技巧）。仅仅插入newColorButton.valueElement = null;并不起作用，也不会像newColorButton.classList.add(' {valueElement:null,value:'66ccff'}'那样。

有什么想法吗？

Answer 1

我从未使用 jscolor ，但您可以按input.value = "";清除按钮的文字。只需在代码＆＃39; 的＆＃39;段中添加此行，然后再将其附加到DOM。

（jscolor）如何将从DOM创建的按钮/输入保持为空（仅限颜色）

1 个答案: