使用jQuery選擇基於無序列表的選項

Question

我已將無序列表轉換爲選擇選項列表，但我不確定如何使「選定」屬性添加了與此相關的選項超鏈接在列表中。

馬克 - 達

<div class="navigation"> 
    <ul> 
     <li><a href="foo.html">Foo</a></li> 
     <li><a href="bar.html" class="selected">Bar</a></li> 
     <li><a href="boo.html">Boo</a></li> 
    </ul> 
</div> 

的Javascript

$('<select />').appendTo('.navigation'); 

// Populate dropdown with menu items 
$('.navigation ul a').each(function() { 
var el = $(this); 
$('<option />', { 
    "value" : el.attr('href'), 
    "text" : el.text() 
}).appendTo('.navigation select'); 
}); 
// Navigate to page on select option 
$('.navigation select').change(function() { 
    window.location = $(this).find('option:selected').val(); 
}); 
// Hide navigation list 
$('.navigation ul').hide(); 

Answer 1

You ca n使用hasClass方法：

$('<option />', { 
    "value"  : el.attr('href'), 
    "text"  : el.text(), 
    "selected" : el.hasClass('selected') 
}).appendTo('.navigation select'); 

http://jsfiddle.net/5V5rY/

Answer 2

你似乎動態創建的選擇元素。

所以，你需要委託事件到closest static parent容器讓它工作..

$('.navigation select').change(function() { 

應該是

$('.navigation').on('change', 'select',function() { 

另外要選擇你可以做.val();值

window.location = $(this).val();