.parents().removeClass()无法正常工作 [英] .parents().removeClass() not working

问题描述

我得到了这个JavaScript，试图删除父元素上的类:

i got this javascript, trying to remove a class on a parent element:

$(this).parents(".box").removeClass("expanded");

在此html上:

<div class="box trx">
<a href="javascript:;" class="open-content"><?php the_post_thumbnail('thumbnail'); ?></a>
<div class="expandable">
    <?php the_content(); ?>
    <span class="simple">
        <a class="cunload" href="javascript:;">Close</a>
    </span>
</div>
</div>

不幸的是，到目前为止，这还行不通.我已经完成了一些测试，例如:

Unfortunately, this doesn't work so far. I've done several tests like:

$(this).parents(".box").removeClass("trx");

和

$(this).parents(".box").addClass("exd");

一切正常.我在 wordpress 网站上使用 jQuery 1.6.2 和 jQuery石工.有一个实时的 演示在这里 ，以查看所有操作(不正常).基本上可以，但是没有从div中删除该类的事实确实会立即重新打开div及其内容.对于为什么不删除.expanded类感到非常困惑.

It all works. I'm using jQuery 1.6.2 and jQuery masonry on a wordpress site. There's a live demo here to see it all (not)working. Basically it works but the fact that the class isnt removed from the div does reopen instantly the div and its content. Am pretty confused on why it does not remove the .expanded class.

我刚刚了解到该类在文档加载时还在那里.之后在图片上单击添加它，因此我认为我的消除问题来自此.抱歉，造成误导.

i just understood that the class is there yet when the document is loaded. It's being added afterwards on a click on a picture, therefore i think my removing problem comes from this. Sorry for the misguiding explanation.

推荐答案

您在.box元素上具有点击处理程序.

You have a click handler on the .box element.

在其中，您可以在.cunload元素上单击处理程序.

And inside it you have a click handler on the .cunload element.

由于.cunload嵌套在.box中，因此当您按下close按钮时，两个元素都会收到click事件，因此它会重新打开.(由于事件使DOM层次结构冒泡，因此 )

Since the .cunload is nested in the .box both elements receive the click event when you press the close button, and so it re-opens.. (due to events bubbling up the DOM hierarchy)

将您的.cunload处理程序更改为

$('.cunload').click(function(e){
            e.stopPropagation();
            restoreBoxes();
            $(this).parents(".box").removeClass("expanded");
});

这篇关于.parents().removeClass()无法正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！