javascript - 使用 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

您尝试的第二种情况应该有效，除非您没有在正确的位置打电话。IE; 等待ajax响应完成。

done尝试在或success（已弃用的）处理程序中调用它

Answer 2

你几乎明白了，在 'options' 中删除 's'：

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

工作的jsFiddle

Answer 3

您还可以使用下一个代码：

myElement[0].selectedIndex = 0;

这个 get 是 Dom 元素（不是 jQuery 对象），与 vanilla Javascript 一起使用，并使用它将第一个选项设置为基于它的索引的选定选项。

Answer 4

如果您想确保您的选项具有价值并且不是占位符，您可以执行以下操作：

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

这样，您将检查 HTML 节点是否具有属性value并且不为空。