jquery - 从div开始在jQuery中选择下拉文本的正确方法是什么？

Question

我正在从一组 div 中动态获取选定的下拉选项的文本。当我这样做时：

$("#divID").children("select").eq(0).find('option:selected').text();

一切正常。但是，当我这样做时：

$("#divID").children("select option:selected").eq(0).text();

它没有按预期抓取文本。我想知道后一种获取文本的方法我做错了什么。谢谢。

score 4 · Accepted Answer

你正在做的问题是你使用children.

如果您要更改children为，find那么它可以完美运行。原因是children它只找到作为被操作集合的直接子元素的元素。所以它只会返回直接孩子的东西#divID。如您所见，这些option元素不是直接子元素，因此无法返回。

$("#divID").find("select option:selected").eq(0).text();

当然，这两者之间存在一些细微的差异。考虑这个 HTML：

<div id="divLocation">
    <div>            
        <select id="1"/>
    </div>
    <select id="2"/>
</div>

我已经删除了选项，但是您的原始选择器将获得 id #2（因为它是唯一的子选择，#divLocation而我的选择将获得第一个选定的选项，大概在 id #1 中。

所以这个故事的寓意是做任何你真正想要的选择器。:)

score 2 · Accepted Answer

我会做这个：

    value = $("#divLocation select option:selected").text();

我不确切知道哪种方法是“正确的”。我认为我的理解很简单。因此，请选择您认为易于阅读的那个。如果需要性能，请仅使用纯 javascript 并让选择具有 ID。

document.getElementById("divLocationSelect").value;

score 1 · Accepted Answer

你可以做：

$("#divID").find("select option:selected").eq(0).text();

该.children()方法的不同之处.find()在于.children()仅在 DOM 树中向下移动一个级别，同时.find()也可以向下遍历多个级别以选择后代元素（孙子等）。

3 回答 3