Question

尝试使用jquery选择器访问可扩展树中的多个标签元素之一时，谷歌搜索和试错了一个小时。 html是这样的：

<span id="ppown" class="treeTitleSpan" role="leaf">PPO</span> 
<span class="treeCheckBoxLabel"> 
    <label class='nodeCheckIcon'  />

或者像这样：

<span id="ppw" class="treeTitleSpan" role="leaf">Other</span> 
<span class="handle closed"></span>
<span class="treeCheckBoxLabel"> 
    <label class='nodeCheckIcon'  />

我从每种情况下的.treeTitleSpan范围开始（在点击处理程序中）。我知道我可以通过以下方式访问：

$(this).next().next().children('.nodeCheckIcon');

另一个用：

$(this).next().children('.nodeCheckIcon');

但我想要一个适用于这两种情况的选择器，'find'似乎不起作用：

$(this).find('.nodeCheckIcon:first')

任何帮助都将不胜感激。

瑞克

Answer 1

$(this).nextAll('.treeCheckBoxLabel').children('.nodeCheckIcon');

或者，如果您可能有多个标签：

<span id="ppw" class="treeTitleSpan" role="leaf">Other</span> 
<span class="handle closed"></span>
<span class="treeCheckBoxLabel"> 
    <label class='nodeCheckIcon'  />
</span>
<span class="treeCheckBoxLabel"> 
    <label class='nodeCheckIcon'  />
</span>

你只想要第一个：

$(this).nextAll('.treeCheckBoxLabel').first().children('.nodeCheckIcon');

Answer 2

这样的事情怎么样：

$(this).nextAll('.treeCheckBoxLabel:first').children('.nodeCheckIcon');

使用:first可确保您最多只选择一个.treeCheckBoxLabel，这可能是也可能不是问题，具体取决于HTML的其余部分。

Answer 3

替代其他帖子（许多方法给猫皮肤涂抹:)）

$(this).siblings(".treeCheckBoxLabel:has(label.nodeCheckIcon):first")

Answer 4

由于this指向的span元素是label的父级的兄弟，因此$(this).find('.nodeCheckIcon:first')无法正常工作。我不知道你的完整标记结构，但如果你有这个span元素的包装容器，那么你可以尝试这个

$(this).parent().find('.nodeCheckIcon:first');

用于查找子元素的jquery选择器

4 个答案: