Question

我在我正在研究的javascript项目中使用Spectrum Color选择器。 https://bgrins.github.io/spectrum/ 它在FireFox中工作正常，但在Internet Explorer中却不行。花哨的颜色选择器弹出窗口降级为简单的文本输入字段。以下是创建输入字段的代码部分：

function updateTables() {
$("#tableTwo tbody").empty();
for (var i = 0; i < polygons.length; i++) {
    //var pColor = new RGBColor();
    var pColor = rgbaToHex(polygons[i].color);
    $("#tableTwo tbody").append('\n<tr '
                                + (selectedPoly == i ? 'style="color:white;background-color:red"' : '')
                                + '><td><input onchange="changeGeometryName(' + i + ')"'
                                + (selectedPoly != i ? 'onfocus="polySelectedFromTable(' + i + ')"' : '') + 'type="text" size="11" '
                                + 'id="polygonName' + i + 'Input"  value="' + polygons[i].name + '" /></td>' + "<td><input type='color'"
                                + ' onchange="setColor(' + i + ')" id="color' + i + '" value="' + pColor + '"/></td>' + "</tr>");
}

}

然后我的HTML文件中有这两行：

<script src='spectrum.js'></script>
<link rel='stylesheet' href='spectrum.css' />

文档说如果javascript不起作用，输入将降级为文本输入，但我知道这不是问题，项目的其余部分工作正常。非常感谢任何帮助！

Answer 1

哦，嗨！

首先，频谱文档对此有点困惑所以我花了一段时间才找到它，但是一旦找到答案，答案实际上真的非常愚蠢：

你没有使用频谱。

首先，文档说：

如果您只想为原生颜色输入提供填充，最简单的方法是使用颜色类型创建输入。一旦用户的浏览器支持本机颜色控件，它将选择使用其本机控件。 Spectrum Docs

所以，这就是我们试图做的事情，却没有意识到我们并没有真正使用频谱。相反，我们使用的是HTML 5颜色输入类型规范，IE不支持该规范（参见color input type support）

因此，为了启用频谱，我们实际上需要调用频谱库，然后它可以工作：

$('#color' + id).spectrum({ color: pColor(, other-parameters-here)});

Spectrum Color-Picker无法在Internet Explorer中使用

1 个答案: