jQuery添加下拉項在Chrome中失敗排序

我想按特定順序在下拉列表中動態添加項目。在FF中它可以工作，在IE和Chrome上它不會。jQuery添加下拉項在Chrome中失敗排序

這裏是我的代碼：

<html> 
<head> 
<title>How to add option to drop down list</title> 
<script src="http://code.jquery.com/jquery-latest.js"></script> 
<style type="text/css"> 
div.demo 
{ 
float:left; 
padding:25px; 
} 
</style> 
<script type="text/javascript"> 
jQuery(document).ready(function($){ 

$('.demoButton').click(function(){ 
var optionList={ 

'firefox':'Mozilla firefox', 
'chrome':'Google chrome', 
'1':'awesome' 
}; 

$.each(optionList,function(val,text){ 

$('.demoDropDown').append($('<option></option>').val(val).html(text)); 
}); 

}); 
}); 
</script> 
</head> 
<body> 
<div class="demo"> 
<button class="demoButton">Click to add option</button> 
</div> 
<div class="demo"> 
<select class="demoDropDown"> 
<option>--Select--</option> 
</select> 
</div> 
</body> 
</html>

我應該看到：

火狐鉻真棒

，但我得到：

真棒火狐鉻

我錯過了什麼？

來源

2014-01-30 Timmy

使用對象時，您不能保證它們會以任何順序回來。如果您需要保留訂單，則應該使用一組對象。

var optionList=[ 
    {val: 'firefox', text: 'Mozilla firefox'}, 
    {val: 'chrome', text: 'Google chrome'}, 
    {val: '1', text: 'awesome'} 
]; 
$.each(optionList,function(){ 
    $newOption = $('<option></option>').html(this.text).attr('value', this.val); 
    $('.demoDropDown').append($newOption); 
});

來源

2014-01-30 01:48:24 dave

不工作，我看到「空白」值的「空白」文本 – Timmy

嘗試用編輯答案 – dave

真棒，謝謝!!!! – Timmy

jQuery添加下拉項在Chrome中失敗排序

回答

相關問題