jquery - 使用选择标签作为导航到其他页面？

Question

我需要通过下拉选择标签使我的网站导航工作。我意识到这将涉及到一点 jQuery。这是我的 HTML 到目前为止的样子：

<div id="top_nav">
<select>
 <option value="">1</option>
 <option value="">2</option>
 <option value="">3</option>
 <option value="">4</option>
 <option value="">5</option>
 <option value="">Contact</option>
 </select>

因此，例如，当用户选择 2 时，它会将他们带到站点的第 2 页。对此非常感谢的任何帮助。

谢谢安吉拉

Answer 1

<select id="selectId " onChange="redirect()">
 <option value="">1</option>
 <option value="">2</option>
 <option value="">3</option>
 <option value="">4</option>
 <option value="">5</option>
 <option value="">Contact</option>
 </select>


    function redirect()
    {
     window.location.href=$('#selectId :selected').text()"+.html";
    }

如果它是基于价值的，那么使用

    window.location.href=$('#selectId').val()"+.html";

Answer 2

如果你在页面上使用 jQuery，你可以这样做：

<div id="top_nav">
    <select>
        <option value="page1.html">1</option>
        <option value="page2.html">2</option>
        <option value="page3.html">3</option>
        <option value="page4.html">4</option>
        <option value="page5.html">5</option>
        <option value="contact.html">Contact</option>
    </select>
</div>

$('#top_nav select').change(function(){
    window.location = $(this).val();
});

Answer 3

那么有不止一种方法。您可以使用html.html()或. 和 val 是.val()<option>here</option><option value="here"></option>

$('select','#top_nav').change(function(){
    document.location=$('select','#top_nav').html()+'.html';
});