填充下拉列表選擇與數組 - 有多個選項

所以我想填充狀態的下拉列表，選項的值應該是兩個字符值，選項的文本應該是完整狀態的名稱，使用下面的代碼返回值爲0,1,2,3 ...並將var中的所有選項作爲文本返回。填充下拉列表選擇與數組 - 有多個選項

var states = ["Select State","","Alabama","AL","Alaska","AK","Arizona","AZ","Arkansas","AR",...]; 
$.each(states, function(val, text) { 
    $('#selector').append($('<option> </option>').val(val).html(text)) 
    });

來源

2011-09-29 Alex C

試試這個，使用對象爲states而不是數組。同樣的結果，但它更清楚什麼是什麼，你就不太可能有問題，如果你不小心跳過一個名稱或縮寫：

var states = { 
    "Select State":"", 
    "Alabama":"AL", 
    "Alaska":"AK", 
    "Arizona":"AZ", 
    "Arkansas":"AR" 
}; 
var val, text; 
for (text in states) { 
    val = states[text]; 
    $('<option/>').val(val).text(text).appendTo($('#selector')); 
};

http://jsfiddle.net/g59U4/

來源

2011-09-29 17:58:29 Blazemonger

的問題是，回調函數提供給.each導致val包含當前迭代（例如0，1，2等）和含text陣列的該索引的值的索引。

要達到什麼樣的你想，你可能會與正常for循環更好：

for(var i = 0; i < states.length; i+=2) { 
    $("#selector").append($('<option> </option>').val(states[i+1]).html(states[i])); 
}

你甚至會更好，關閉緩存包含#selector之外你的循環jQuery對象，所以它不必每次迭代查看它。

這是上述的working example。

另一種選擇是使用一個對象而不是數組，使用狀態名稱或縮寫作爲鍵，另一個作爲值。 編輯：就像@ mblase75已經完成

來源

2011-09-29 17:56:17

那麼你有jQuery.each函數參數混淆。第一個是數組中值的索引，第二個是數值本身。你需要做的是這樣的：

$.each(states, function(index) { 
    if(index%2 > 0) { 
     //continue, basically skip every other one. Although there is probably a better way to do this 
     return true; 
    } 
    $('#selector').append($('<option> </option>').val(states[index+1]).html(states[index])) 
});

來源

2011-09-29 17:56:21

，我和其他人，一個正常的循環會更適合這種情況下同意。如果你確實想使用jQuery，這將是一種方法 –

這將是非常簡單的，如果你的數組有兩個維度。考慮到你真正需要使用你提供的一維數組，你可以這樣做：

var states = ["Select State","","Alabama","AL","Alaska","AK","Arizona","AZ","Arkansas","AR"]; 
for(var i=1; i<states.length; i+=2) { 
    $('#selector').append($('<option value="' + states[i] + '">' + states[i-1] + '</option>').val(val).html(text)) 
}

來源

2011-09-29 17:56:43 bfavaretto

如果你改變了你的陣列是對象的數組，你可以做這樣的事情 -

var states = [{"text":"Select State","val":""},{"text":"Alabama","val":"AL"}]; //etc 
$.each(states, function(val, statedata) { 
    $('#selector').append($('<option> </option>').val(statedata.val).html(statedata.text)) 
});

這種變化在每次回調傳遞一個JavaScript對象。該對象具有text和val屬性，並作爲參數statedata傳遞給回調函數。 val參數保存數組的當前索引位置，因此不需要填充選擇框。

演示 - http://jsfiddle.net/sR35r/

來源

2011-09-29 17:59:52 ipr101

我有類似的情況填充一個選擇列表與二維數組作爲$就回調的結果....

JSON ...  
[["AL","Alabama"],["AK","Alaska"],["AS","American Samoa"],["AZ","Arizona"] ... 

var stateOptions = $('#state'); 
var html =''; 
for (var i =1; i<data.length; i++){ 
    html+= '<option value="' +data[i][0]+ '">' +data[i][1]+ '</option>'; 
} 
stateOptions.append(html);

<form name="form" id="form"> 

<select name="state" id="state"> 
     <option value=''>State</option> 
</select> 

</form>

來源

2012-09-27 00:52:55

填充下拉列表選擇與數組 - 有多個選項

回答

相關問題