如何使用預選值初始化下拉列表（<select/>），然後進行更改？

我在每一行都有一個下拉網格，我需要從數據庫中呈現它的狀態。所以我得到了像這樣定義的下拉菜單，其中指定了選定的選項來預先選擇數據庫中的值。如何使用預選值初始化下拉列表（<select/>），然後進行更改？

<select id='selectId'> 
<option value='1'>Option 1</option> 
<option value='2' selected='selected'>Option 2</option> 
<option value='3'>Option 3</option> 
</select>

的問題是，當我改變它的UI改變瀏覽器一樣，定義一個下拉的價值，但選擇的屬性不動，並保持它在哪裏。所以當我然後調用$（「＃selectId」）。val（）我得到舊的一個值。

什麼是適當的方式來初始化下拉控件，然後有能力在瀏覽器或jQuery中自由更改它的值？

來源

2012-02-29 drunkcamel

爲了說明問題，當您使用上面的代碼時，將'option value ='2''標記爲'selected'將會將選項2設置爲默認選擇，您不能選擇任何其他選項。 – 2012-02-29 05:03:36

當你說「手工」，你的意思是通過jQuery代碼或不？ – 2012-02-29 05:03:37

@Jonathan Eckman，我現在明白了。你能給出一個建議，如何預先選擇html的下拉值，而不是js？也許我必須使用上面的代碼，並在網格呈現後刪除所有下拉菜單中的所有「選定」值？ icyrock.com，我的意思是在瀏覽器中。不與js（jQ）。 – drunkcamel 2012-02-29 05:18:58

這似乎是工作好（Ubuntu上的Firefox）：

HTML

<select id='selectId'> 
<option value='1'>Option 1</option> 
<option value='2' selected='selected'>Option 2</option> 
<option value='3'>Option 3</option> 
</select>

$('#selectId').change(function() { 
    var opt = $(this).find('option:selected'); 
    console.log([opt.val(), opt.text()]); 
}); 

var opt_sel = $('#selectId option:selected'); 
opt_sel.val(99); 
opt_sel.text('Changed option');

如果您選擇的選項，你會看到，它會打印更改版本。工作示例：

http://jsfiddle.net/vm4Q8/

希望這有助於。

來源

2012-02-29 05:12:52

它應該很好。可能是你沒有正確設置它。

您應該將value的選項通過val()方法進行選擇。

E.g $('#selectId').val('1');將設置爲選定的第一個選項，然後調用$('#selectId').val()將給你1而不是2。

這裏是工作示例http://jsfiddle.net/3eu85/

來源

2012-02-29 05:03:48 ShankarSangoli

哪個瀏覽器是你在嘗試這種？你的代碼對我來說看起來很好，並且似乎在this jsFiddle中工作。

來源

2012-02-29 05:04:07

你可以選擇的選項的VAL，而不是選擇

$('select#selectId option:selected').val();

文檔：http://api.jquery.com/val/

來源

2012-02-29 05:05:51 maxijb

請使用此代碼代替，

$('#selectId option:selected').val();

來源

2012-02-29 05:05:52

如何使用預選值初始化下拉列表（<select/>），然後進行更改？

回答

相關問題