Question

我正在使用一个jquery插件，它要求我用一个用作选择器的字符串来识别某些按钮，但它不允许我提供选择器的上下文或使用遍历函数。

如果我有：

<div>
    <div id="dialog"></div>
    <div>
        <button><span>back</span></button>
        <button><span>next</span></button>
    </div>
</div>

当我需要提供选择器时，我所知道的是对话框的id（在本例中为“#dialog”）。

此选择器正确选择“下一步”按钮：

$("button:contains('next')", "#dialog ~ div")

可以在没有上下文参数的情况下重写该选择器吗？我尝试了这个，但它没有返回任何元素：

$("#dialog ~ div button:contains('next')")

我假设正在寻找兄弟姐妹的按钮而不是兄弟姐妹中的按钮，这就是它失败的原因。

Answer 1

在按钮中添加一个类，并在选择器中使用它。例如，将标记更改为：

<div>
    <div id="dialog"></div>
    <div>
        <button class='back'><span>back</span></button>
        <button class='next'><span>next</span></button>
    </div>
</div>

然后这个选择器应该起作用：

$("#dialog ~ div button.next")

~~~也会起作用，但+更具体。~~（编辑，而不是像示例中那样在div之后非正常）

我认为问题是按钮不包含next，它包含<span>next</span>。使用:contains('<span>next</next>')代替.next似乎选择了span，而不是button。

Answer 2

我知道的另一种方式是

$("#dialog").find("button:contains('next')")

Answer 3

你能用这个吗？ http://jsfiddle.net/Wd4zF/

$('#dialog').next().children('button span:last');

Answer 4

事实证明这是jQuery使用的Sizzle选择器引擎中的一个错误。我已为其创建了ticket 9939并提交了patch来修复它。

兄弟姐妹的jQuery选择器，不提供上下文或使用遍历函数

4 个答案: