IE 11 不会更新"选择元素"中的选定选项项标签

我想做什么

在A 中，动态更改所选选项元素的标签 select element ie 11。

我期望的

作为选定选项元素的标签正在更改，也显示了 select element 更改的文本。

实际发生了什么

ie 11忽略了选项元素的标签正在更改的事实。选定的选项元素和在 select element 上显示的相应文本才能更改，直到再次选择 select element 。

请参阅下面的代码：

html

<!DOCTYPE html>
<html>
    <head>
        <script defer src="script.js"></script>
    </head>
    <body>
        <select>
            <option id="option1">Option 1</option>
            <option id="option2">Option 2</option>
            <option id="option3">Option 3</option>
        </select>
        <input id="field1" oninput="setLabel()" >
    </body>
</html>

javascript

function setLabel() {
    var text = document.getElementById("field1").value;
    document.getElementById("option1").label = text;
}

因此，在Option 1上保留选择元素，在输入字段中输入文本。选项元素在选择选择元素之前不会更新其文本。

它在Chrome中正常工作。关于如何破解或提醒更新的IE11的任何想法？

在IE11中测试 - 不是模拟器。哇...这是这个骇客，但我认为它可以做您需要的。控制台日志调用和从选定选项的多个更改对于重新启动是必需的。少，标签有时是击键或两个。

function setLabel() {
  let inputText = document.getElementById("field1").value,
    selectField = document.getElementById("select1");
  selectField.value = "2";
  document.getElementById("option1").label = inputText;
  console.log(inputText);
  selectField.value = "1";
  selectField.value = "2";
  selectField.value = "1";
}

<select id="select1">
            <option id="option1" value="1">Option 1</option>
            <option id="option2" value="2">Option 2</option>
            <option id="option3" value="3">Option 3</option>
        </select>
<input id="field1" oninput="setLabel()" >

相关内容

最新更新

热门标签：