.append()、选择列表和 Chrome 81 的问题

Question

从 Chrome 81 版本开始，从选择列表中提取选项并重新添加它们.append()似乎无法按预期工作。此行为在 Chrome 80 中有效，并且在其他浏览器中继续有效。我做错了什么，还是 Chrome 中的错误？

示例代码步骤

• 获取选择列表
• 从中获取选项（在生产代码中我正在操作它们，但在本例中不是）
• 从列表中删除选项
• 将选项重新添加到列表中

预期行为

列表有选项

实际行为

没有显示选项，尽管 DOM 检查器显示它们存在

片段

function test() {
   var selectItem = $("#selectOne");
   var items = selectItem.find('option');
   selectItem.empty();
   selectItem.append(items);  
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="selectOne" multiple>
  <option>A</option>
  <option>B</option>
  <option>C</option>
  <option>D</option>
  <option>E</option>
</select>

<br/>

<button onclick="test()">Go</button>

将以下行添加到我的 javascript 末尾确实“修复”了问题：

selectItem.get(0).innerHTML = selectItem.get(0).innerHTML;

然而，这显然不是一个实际的修复。我只将它包含在这里，以防它有助于比我更了解这一点的人查明问题。

编辑 4 月 21 日：https : //bugs.chromium.org/p/chromium/issues/detail? id =1073172（感谢打开这个的人！）

Answer 1

克隆你的option，这样做会再次呈现选项，

这是您唯一需要更改的行

var items = selectItem.find('option');

对此

var items = selectItem.find('option').clone();

var items = selectItem.find('option');

var items = selectItem.find('option').clone();