选择菜单，使用 JQuery 转到选择的 url？

Question

我有以下 html：

HTML 标记

<ul id="test">
   <li><a href="http://www.yahoo.com">yahoo</a></li>
   <li><a href="http://www.google.com">Google</a></li>
</ul>

和一些 JS 代码：

JQuery/JavaScript 代码

$('ul#test').each(function()
{
   var select=$(document.createElement('select')).insertBefore($(this).hide());
   $('>li a', this).each(function()
   { 
 option=$(document.createElement('option')).appendTo(select).val(this.href).html($(this).html());
   });
});

此代码生成一个选择下拉菜单，正是我想要的，但我的问题是如何做我转到选择的网址？那么如果我点击 yahoo，它会将我带到 yahoo.com？

感谢您的帮助！

Answer 1

$('ul#test').each(function()
{
   var select=$(document.createElement('select')).insertBefore($(this).hide());
   $('>li a', this).each(function()
   { 
 option=$(document.createElement('option')).appendTo(select).val(this.href).html($(this).html());
   });
   select.change(function(){
    //alert('url = ' + this.value );
    window.location.href = this.value;
  })
});

已在主要浏览器上测试演示。

Answer 2

这应该可以做到：

 $('ul#test').each(function()
    {
       var select=$(document.createElement('select')).insertBefore($(this).hide());
       $('>li a', this).each(function()
       { 
     option=$(document.createElement('option')).appendTo(select).val(this.href).html($(this).html());
     option.click(function(){window.location = $(this).val())});
       });
    });

Answer 3

将更改事件添加到选择的创建中，并将用户发送到所选值。

var select=$(document.createElement('select')).insertBefore($(this).hide()).change(function(){
  document.location.href = $(this).val();
}); 

Answer 4

尝试一下：

$('ul#test').each(function()
{
   // also give the select an id
   var select = $(document.createElement('select')).attr('id', 'myselect').insertBefore($(this).hide());

   $('>li a', this).each(function()
   { 
     option=$(document.createElement('option')).appendTo(select).val(this.href).html($(this).html());
   });
});

现在进行重定向......

$(function(){
  $('#myselect').live('change', function(){
    document.location.href = $(this).val();
  });
});

live() 方法是因为您的选择框是在 DOM 中动态创建的。

Answer 5

<select name="dest" class="selec" onchange='document.location.href=this.options[this.selectedIndex].value;'>