将列表的搜索栏转换为选择的搜索栏？

Question

我目前在JavaScript中为<ul><li></li></ul>设计了搜索功能。但是，我现在将列表转换为<select><option></option></select>。 select标签实际上是从文本文件读取的，并将每个选择生成为。有人可以帮助我如何转换此搜索功能以使用标签吗？这是JS：

function mysearchFunction() {

    var input, filter, ul, li, a, i, txtValue;
        input = document.getElementById("mysearchInput");
        filter = input.value.toUpperCase();
        ul = document.getElementById("myUL");
        li = ul.getElementsByTagName("li");

    for (i = 0; i < li.length; i++) {
        a = li[i].getElementsByTagName("a")[0];

        if (a) {
          txtValue = a.textContent || a.innerText;
        } else {
          txtValue = '';
        }
        if (txtValue.toUpperCase().indexOf(filter) > -1) {
            li[i].style.display = "";
        } 
        else {
            li[i].style.display = "none";
        }
    }
}

HTML：

<ul id="myUL">
    <input type="text" id="mysearchInput" onkeyup="mysearchFunction()" placeholder="Search for location..." title="Location">
    <label><select size=5 id="myList" class="list-content" onchange="setPicture();"></select>
    </label>
    </ul>

Answer 1

假设您想要这样的东西：