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

＆lt; td class =“second”＆gt;
＆lt; input type =“color”id =“colo_0”value =“＃8080ff”class =“datafield”＆gt;

＆LT; / TD＆GT;

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

Answer 1

有趣。我能够复制你的结果（example）。

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

inp.value = '#ffffff';

显然这让Chrome很开心。（Live Copy | Source）

附注：您通过setAttribute设置的所有内容都反映了您可以使用的属性：

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

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

Updated Example | Source

Answer 2

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

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

2 个答案: