Question

我有一个带有多个选项的select，这些选项的背景在javascript代码中动态变化。在Chrome和Opera上运行正常，但在Firefox上运行不正常。这是HMTL元素：

<div style=" text-align:center;margin-bottom: 15px;margin-right: 10px">
    <select id="measure" style="width:90%" name="measure" class="dropdownS" required></select>
    <select id="duration" style="width:40%" name="date" class="dropdownS" required></select>
</div>

这是CSS：

.dropdownS {
    width: 20%;
    margin-bottom: 10px;
    margin: 10px;
    -moz-appearance: none;
    appearance: none;
    -webkit-appearance: none;
    border: none;
    background-image: url("https://cdn1.iconfinder.com/data/icons/cc_mono_icon_set/blacks/16x16/br_down.png");
    background-repeat: no-repeat;
    background-position: right center;
}

以及用于更改背景的代码行：

const selYear = document.getElementById('duration');

let opt = document.createElement('option');
opt.appendChild(document.createTextNode('Test');
opt.style.backgroundColor = '#90EE90';
opt.value = 'Test';
selYear.appendChild(opt);

我如何也可以在Firefox中使用它？

更改HTML选择项的背景在Firefox中不起作用

0 个答案: