0

我将以下行绑定到单击事件：

$(this).parents(".addonoptions").children().removeClass("highlight");

它应该从父母的孩子中剥离“突出”类。但它什么也没做。

如果我将其更改为：

$(this).parents(".addonoptions").children().addClass("highlight");

然后突出显示类成功添加到所有孩子。同样，如果我将“removeClass”更改为“hide()”，那么选定的元素会被很好地隐藏，所以我知道选择了正确的元素。我已经阅读了许多关于 removeClass 不起作用的其他问题和答案，但在这种情况下似乎没有一个答案有效。

这是 HTML 外观的基本示例，“clickme”类与上面的事件相关联。

<div class="addonoptions">
<div><p class="clickme">Click to remove highlights</p></div>
<div class="highlight"><p class="clickme">Click to remove highlights</p></div>
</div>
4

3 回答 3

1

children仅查找直接子节点（在这种情况下，使用<div>s 而不是<p>标签，find而是使用。

现场示例 - http://jsfiddle.net/sKz6y/

于 2012-06-28T01:51:46.850 回答
1

如果$(this)是<p>标签，那么children()调用将返回<div>s 的集合。您需要使用 jQuery 的find方法：

尝试：

$(this).parents(".addonoptions").find('p').removeClass("highlight");

http://api.jquery.com/children/

http://api.jquery.com/find/

<div class="addonoptions">
    <div>
        <p class="clickme">Click to remove highlights</p>
    </div>
    <div class="highlight">
        <p class="clickme">Click to remove highlights</p>
    </div>
</div>​

$('.clickme').on('click', function(){
    $(this).parents('.addonoptions').children().removeClass('highlight');
    $(this).parent().addClass('highlight');
});​

http://jsfiddle.net/E4K7P/

于 2012-06-28T01:52:41.737 回答
1

您可以通过简单地在类本身上调用 removeClass 来真正简化删除：

演示：http: //jsfiddle.net/hwxj9/

$('.clickme').click(function() {
    /* remove highlight class*/
    $('div.highlight').removeClass('highlight');
    /* or if class exists in other parts of page
       $(this).closest('.addonoptions').find('div.highlight').removeClass('highlight');

     */
    /* highlight parent of p */
    $(this).parent().addClass('highlight');

})
于 2012-06-28T02:12:47.393 回答