开发者

jquery how to use a select list to redirect to new pages?

开发者 https://www.devze.com 2023-03-10 13:09 出处:网络
i am trying to create a select list and when a user selects an option it will go to a html page <select name=\"test开发者_Python百科\" id=\"test\">

i am trying to create a select list and when a user selects an option it will go to a html page

<select name="test开发者_Python百科" id="test">
<option value="about.html">about</option>
<option value="portfolio.html">portfolio</option>
</select>

i am trying to imitate this ul:

<ul id="nav">
    <li><a href="about.html">about</a></li>
    <li><a href="portfolio.html">portfolio</a></li>
</ul>

any ideas? thanks


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


An inline example:

<select onchange="location.href = this.value;">
    <option value=""></option>
    <option value="http://www.google.com">google</option>
    <option value="http://www.yahoo.com">yahoo</option>
</select>

Also, here's the example fiddle.


$("#test").bind("change", function() {
      location.href = $(this).val();
});


  $('#test').change(function() {

var page = $(this).val();
window.location.replace(page);

       });


The right way to it (I mean: accessible, that works without js too), is to have a form anyway (with also a "Go" button that will submit the form. You could hide the button though). The idea behind this system is that on the "change" event of the select you will submit() the form. Server side you will then redirect the user to the page you need.


$("#test").change(function () {
  $(location).attr('href', $(this).val());
});
0

精彩评论

暂无评论...
验证码 换一张
取 消