javascript - 通过js创建时HTML5输入类型颜色不显示值

Question

我正在通过 javascript 创建一个表，其中一列将包含一个 html 颜色选择器。我遇到的问题是，在 Chrome 中设置了默认值，但颜色选择器上显示的颜色是黑色。

这是我正在使用的 javascript

c = r.insertCell(1);
c.setAttribute('class','second');
inp=document.createElement("input"); 
inp.setAttribute('type','color');
inp.setAttribute('id','colo_'+i);
inp.setAttribute('value','#ffffff');
inp.setAttribute('class','datafield');
inp.addEventListener('change', saveFields);
c.appendChild(inp);

这是从 if 生成的 html

<td class="second">
<input type="color" id="colo_0" value="#8080ff" class="datafield">
</td>

这是一个错误还是我做错了什么？

Answer 1

有趣的。我能够复制您的结果（示例）。

而不是使用setAttribute，value直接设置：

inp.value = '#ffffff';

显然这让 Chrome 很高兴。（Live Copy |来源）

---

旁注：您设置的所有内容setAttribute都具有您可以使用的反映属性：

inp = document.createElement("input"); 
inp.type = 'color';
inp.id = 'colo_'+i;
inp.value = '#ffffff';
inp.className = 'datafield';

请注意，最后一个是className而不是class.

更新示例| 来源

Answer 2

有一天它可能对某人有帮助，所以我就把它放在这里：输入颜色的值似乎只适用于十六进制值（而不是 RGB） - 所以如果你的颜色是 RGB - 首先将其切换为十六进制。RGB转十六进制