Spectrum Color-Picker не работает в Internet Explorer

Я использую средство выбора цвета Spectrum в проекте javascript, над которым я работаю. https://bgrins.github.io/spectrum/ Он отлично работает в FireFox, но не в Интернете. Исследователь. Причудливое всплывающее окно выбора цвета превращается в простое поле ввода текста. Вот часть кода, которая создает поле ввода:

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 не работает, но я знаю, что это не может быть проблемой, поскольку остальная часть проекта работает нормально. Любая помощь приветствуется!


javascript color-picker internet-explorer spectrum
person DireDrop    schedule 28.07.2015    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Oh hi!

Итак, во-первых, документация по спектру была немного запутанной, поэтому мне потребовалось некоторое время, чтобы найти, но ответ на самом деле очень, очень глупый, как только вы его найдете:

Вы не используете спектр.

Итак, во-первых, в документации сказано:

Если вы просто хотите предоставить полифилл для ввода собственного цвета, самый простой способ — создать ввод с типом цвета. Как только браузер пользователя поддерживает собственный элемент управления цветом, вместо этого он предпочтет использовать его собственный элемент управления. Документация Spectrum

Итак, это то, что мы пытались сделать, не понимая, что на самом деле мы не используем спектр. Вместо этого мы использовали спецификацию типа ввода цвета HTML 5, которая не поддерживается IE (см. ввод цвета поддержка типа)

Итак, чтобы включить спектр, нам действительно нужно сделать вызов библиотеки спектра, и тогда это сработает:

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