jquery - 添加和删​​除类问题 JQuery

Question

我正在尝试删除一个由先前的 JQuery 事件添加的类，但它不会发挥作用。请指导我！

这是应用类的内容：

$('.project').click(function() {
        var imageTotal = $(this).find('.gallery img').length;
        if (imageTotal === 1) {
            $('.next-image', this).hide();
            $('.prev-image', this).hide();
        } else {
            $('.next-image', this).show();
            $('.prev-image', this).show();
        }
        $('img.feature').hide();
        $('.gallery img:nth-of-type(' + imageCounter + ')', this).addClass('current');
        $(this).addClass('active');
    });

这就是我试图删除它的内容：

$('.back').click(function() {
        $('.gallery').hide();
        $('.back').hide();
        $('img.feature').show();
        $(this).parent('.project').find('div').removeClass('active');
        $('.prev-page').show();
    });

这是 HTML 结构：

<div class="project">
                <img class="feature" src="content/dream1.jpg"/>
                <div class="description">
                    <h3>Exhibition Roadshow</h3>
                    <h4>The Royal Borough of Kensington and Chelsea 2012</h4>
                </div>
                <div class="gallery">
                    <img src="content/dream2.jpg"/>
                    <img src="content/dream3.jpg"/>
                    <img src="content/dream4.jpg"/>
                    <img src="content/dream5.jpg"/>
                    <div class="next-image">&rarr;</div>
                    <div class="prev-image">&larr;</div>
                </div>
                <div class="back">S</div>
            </div>

您可以在此处查看实时示例，如果这有帮助...

Answer 1

您正在从错误的元素中删除该类。这一行：

$(this).parent('.project').find('div').removeClass('active');

应该是这样的：

$(this).closest('.project').removeClass('active');

由于 .project 是您要删除活动类的元素。您在上面所做的是在 .project 元素中搜索“div”。

Answer 2

你的第一个问题是：$(this).parent('.project')。find('div') .removeClass('active');

但真正的问题是，该类确实被删除了，但是您未能终止 catch 事件，因此它会冒泡到您.project的单击事件，该事件再次设置了相同的类。这一切都发生在同一时间，所以似乎这个类永远不会被删除。

解决方案？return false;在点击事件结束时添加

Answer 3

在$('.project').click(function() {方法 $(this).addClass('active');中将活动添加到$('.project')...

并且您正试图将其从$('.project')...的孩子中删除，您需要的是

$('.back').click(function() {
        $('.gallery').hide();
        $('.back').hide();
        $('img.feature').show();
        $(this).parent('.project').removeClass('active');
        $('.prev-page').show();
    });