如何使用 jQuery 设置 .selectedIndex

Question

我有一些 html 选择：

<select class="form-control, dropdown" id="delperffrom" name="delperffrom">
. . .
<select class="form-control, dropdown" id="delperfto" name="delperfto">
. . .

我想将它们初始化为“无价值”，所以有这个 javascript，它可以工作：

document.getElementById("delperffrom").selectedIndex = -1;

..还有这个 jQuery，它没有：

$("#delperfto").selectedIndex = -1;

为什么 jQuery 不起作用？

Answer 1

.selectedindex 是 DOM 元素的属性，而不是 jQuery。您可以在 DOM 元素上更改它，或使用 jQuery .prop() 方法：

$("#delperffrom")[0].selectedIndex = -1; // change on dom element pulled from jQuery
$("#delperffrom").prop('selectedIndex',-1); // change with .prop() jquery method

Answer 2

因为$("#delperfto") 不是 DOM 元素。它是一个 jQuery 对象，而 jQuery 对象没有 .selectedIndex 属性。 jQuery 对象是它自己的对象类型，具有自己的属性和方法。它没有与 DOM 元素相同的属性和方法。它通常有一种完成相同事情的方法，但通常使用不同的语法。

您可以从 jQuery 对象中获取 DOM 元素并直接访问该 DOM 元素，如下所示：

$("#delperfto")[0].selectedIndex = -1;

或

$("#delperfto").get(0).selectedIndex = -1;

或者，您可以使用 jQuery 的 .prop() 方法让它为您在每个 DOM 元素上设置所需的属性，如下所示：

$("#delperfto").prop("selectedIndex", -1);

在这种特定情况下，其中一个或另一个没有特别的优势，但是如果您的选择器在其中返回了多个元素，例如：

$(".options").prop("selectedIndex", -1);

然后 jQuery .prop() 方法将在选择器匹配的所有 DOM 元素上设置该属性，而不仅仅是第一个有时非常有用的元素。