当我将它移到 JavaScript 时，下拉菜单不起作用答案

【问题标题】：Dropdown doesnt work when I moved it to JavaScript当我将它移到 JavaScript 时，下拉菜单不起作用
【发布时间】：2021-10-14 00:08:44
【问题描述】：

我有一个从这里获取的下拉列表，https://www.w3schools.com/HOWTO/howto_custom_select.asp，在 html 中可以正常工作：

<div class="custom-select">
                      <select>
                        <option value="0">Select</option>
                        <option value="0">07.30 - 68.30</option>
                        <option value="0">07.30 - 98.30</option>
                      </select>
                  </div>

但我需要在 JavaScript 中使用按钮的点击事件来创建它：

    function addRow(btn) {
      document.querySelector("#content").insertAdjacentHTML(
        "afterbegin",
        `<tr>
        <td>${btn.id}</td>
        <td>
          <div class="custom-select">
            <select>
              <option value="0">IS</option>
              <option value="1">IS 1</option>
              <option value="2">IS 2</option>
            </select>
</div>
        </td>
      </tr>`
      );
    }

但是当我这样做时，下拉菜单不再打开。因此，当我在 javascript 中编写代码时，我看到元素就像在 DOM 中一样：

<td>
            <div class="custom-select">
                <select>
                  <option value="0">IS</option>
                  <option value="1">IS 1</option>
                  <option value="2">IS 2</option>
                </select>
            </div>
        </td>

但在 html 中是这样的：

<div>
                    <div class="custom-select">
                        <select>
                          <option value="0">IS</option>
                          <option value="1">IS 1</option>
                          <option value="2">IS 2</option>
                        </select>
                    <div class="select-selected">IS</div><div class="select-items select-hide"><div>IS 1</div><div>IS 2</div></div></div>
                </div>

所以我不知道为什么它不会自动添加 ISIS 1IS 2。

你知道为什么吗？

谢谢。

【问题讨论】：

在 Safari for Mac 上一切正常。
请分享您要插入此行的表格是什么样的。 minimal reproducible example 会很好
还有问题吗？

标签： javascript html select dropdown

【解决方案1】：

您尚未关闭 .custom-select <div> 标记。可能是问题的原因

【讨论】：