用原生js实现模糊搜索的select

好的，我可以为你提供一种实现模糊搜索的select的方法。首先，我们需要一个带有选项的select元素和一个输入框来输入搜索的关键字。然后，我们需要使用JavaScript来实现模糊搜索的功能。

以下是一个简单的实现模糊搜索的select的代码示例：

<select id="mySelect">
  <option value="apple">Apple</option>
  <option value="banana">Banana</option>
  <option value="cherry">Cherry</option>
  <option value="orange">Orange</option>
  <option value="pear">Pear</option>
</select>
<input type="text" id="searchInput" />

<script>
  const select = document.getElementById("mySelect");
  const searchInput = document.getElementById("searchInput");

  // 绑定输入框的输入事件
  searchInput.addEventListener("input", function () {
    const searchValue = searchInput.value.toLowerCase();

    // 遍历所有选项
    for (let i = 0; i < select.options.length; i++) {
      const option = select.options[i];
      const optionValue = option.value.toLowerCase();

      // 判断选项是否符合搜索关键字
      if (optionValue.includes(searchValue)) {
        option.style.display = "";
      } else {
        option.style.display = "none";
      }
    }
  });
</script>

这段代码会在输入框输入关键字时，遍历所有选项并判断选项是否包含关键字。如果选项符合搜索关键字，则显示该选项，否则隐藏该选项。这样就实现了一个简单的模糊搜索的select。