JavaScript：如何根据“数据列表”的选定项将用户重定向到页面

我有这个数据列表，例如：

    <datalist id ="List_1">
     <option value="Page 1">
     <option value="Page 2">
    </datalist>

    <input type = "search" name = "search" list = "List_1">

如果用户在列表中选择第1页时选择了第1页，如何将其重定向到第1页。

---

提前谢谢~

您可以将以下html与javascript结合使用，将页面重定向到给定链接：

<datalist id="List_1">
   <option value="Page 1"></option>
   <option value="Page 2"></option>
</datalist>

<input type="search" name="search" list="List_1">

document.querySelector('input').oninput = function() {
   window.location.href = this.value;
};

---

希望这有帮助

听起来你真的想要跳转列表而不是数据列表。但无论如何，你的听众应该是这样的

function(e){
    if (e.target.list.options[0]){
        /* location.href = ''; */
    }
}

---

如其他评论中所述，跳转列表可能更合适。当用户在输入中输入不在数据列表中的内容时，您会将其重定向到何处

如果要确保该值是数据列表中的选项之一，则必须执行exra检查：

document.querySelector("input[name='search']").addEventListener('input', function(e){
   var input = e.target,
       val = input.value;
       list = input.getAttribute('list'),
       options = document.querySelectorAll('#'+list + ' option');

    for(var i = 0; i < options.length; i++) {
        var option = options[i];
        if(option.value === val) {
            // we have a match, go to the value url
            window.location.href = "http://example.com/" + val;
        }
    }

    // still here? no match found
    doSomethingElse();
});

---

您需要侦听输入上的keyup事件，并查看该值是否与第1页匹配。试一试，让我们看看你有什么，然后我们也许可以提供更多帮助。@technophobia我只想知道将用户定向到指定链接的命令是什么，我知道如何检索他选择的索引并使用事件调用函数，但如果他选择了第一个索引，然后是所需的命令，我只需要定向命令听起来你真的想要一个跳转列表而不是数据列表。输入事件会在每个字符输入时触发。一旦您在输入框中键入一个字母，这将为该字母打开一页。这似乎不是个好办法