如何选择“:even”父级元素？

Question

我将尝试创建一个 if 语句，当按钮的父元素是其父元素的偶数子元素时，执行 alert("it works");，否则执行 alert("nope");。这可能非常简单，因为我很新手！ :) 这是我目前的代码：

HTML:

<div>
    <div>
        <button>#0</button>
    </div>
    <div>
        <button>#1</button>
    </div>
    <div>
        <button>#2</button>
    </div>
    <div>
        <button>#3</button>
    </div>
</div>​

JS:

$(function () {
        $("button").click(function () {
            var $parent = $(this).parent();
            if ($parent.is(":even")) {
                alert("it works");
            } else {
                alert("nope");
            }
        });
});​

jsFiddle: http://jsfiddle.net/goldson/Rn6gz/1/

提前致谢！

- Jake

Answer 1

您可以使用 index() 来获取索引，并使用模运算符 % 确定其是偶数还是奇数。

演示

$(function () {
    $("button").click(function () {
        var $parent = $(this).parent();
        if ($parent.index() % 2 == 0) {
            alert("it works");
        } else {
            alert("nope");
        }
    });
});​

- Adil

---

我一开始想使用index()，可能会选择它。但为什么":even"不起作用呢？ - Jake

Answer 2

一个解决方法是为你的偶数div元素添加类：

演示

<div id="parentDiv">
    <div>
        <button>#0</button>
    </div>
    <div>
        <button>#1</button>
    </div>
    <div>
        <button>#2</button>
    </div>
    <div>
        <button>#3</button>
    </div>
</div>


$(function () {

    var arr = $('#parentDiv div');
    arr.filter(":even").addClass("even");

    $("button").click(function () {
        var $parent = $(this).parent();
        if ($parent.is(".even")) {
            alert("it works");
        } else {
            alert("nope");
        }
    });

});

- Akhil Sekharan