使用jQuery將選擇框值設置為第一個選項

Question

我正在動態填充帶有選項的選擇框。 當我這樣做時，我希望選擇框的值是第一個選項的值（如果你願意，可以選擇'默認選項'）。 聽起來很簡單，但我無法讓它發揮作用。

var myElement = $('select[name="myName"]');

....嘗試了以下三種變化

// myElement.find('option').first().prop('selected', 'selected');
// myElement.val(myElement.find('options').first().val());
myElement.prop('selectedIndex', 0);

...但是以下行給出了空白警報

alert(myElement.val());

我哪里錯了？

Answer 1

選項應該是選項

myElement.find('option:eq(0)').prop('selected', true);

您可以使用選項上的eq選擇器來選擇第一個選項。

如果您知道第一個選項的值。 然后你就可以做到

myElemeent.val('first value') // Which selects the option by default

你試過的第二種情況應該有效，除非你沒有在正確的位置打電話。 即; 等待ajax響應完成。

嘗試在done或success （不建議使用）處理程序中調用它

Answer 2

你幾乎得到了它，把's'放在'選項'中：

myElement.val(myElement.find('option').first().val());

工作jsFiddle

Answer 3

您還可以使用下一個代碼：

myElement[0].selectedIndex = 0;

這是獲取Dom元素（不是jQuery對象），使用vanilla Javascript並使用它根據它的索引將第一個選項設置為選定的選項。

Answer 4

如果您想確保您的選項具有值並且不是占位符，您可以執行以下操作：

$('select option').filter( function (index, option) {
  return option.attributes.value
}).val()

這樣，您將檢查HTML節點是否具有屬性value並且不為空。