javascript - 使用 jQuery 从两个元素中删除类

标签 javascript jquery css css-animations

我的动画有一个奇怪的(又一次)问题。

简而言之,我有一张图片,当我点击它时,出现了两个div,并且有一个关闭按钮可以删除那些div。但是当我点击那个按钮时,只有一个 div 消失了。

这两个新的 div 有一个调试类,我通常在单击按钮时将其删除

$('#gallery').on('click', 'li', function(e) {

        // To display the animations with position
        var $this = $(this),
            dataItem = $this.data('item');

        // Left animation
        if ( dataItem == 1 ) {
            console.log( $this );

            $this
                .addClass('active')
                .find('.info-texte')
                    .removeClass('hidden')
                    .addClass('debug');

            // When animation is ended add the second part
            $this.find('.debug').on('animationend webkitAnimationEnd oAnimationEnd MSAnimationEnd', function() {
                $this.find('.info-btn')
                    .removeClass('hidden')
                    .addClass('debug');
            });
        }

        // Supprime le href event
        e.preventDefault();
    });

    $('.btn-close').on('click', function() {
        var $this = $(this);

        $this
            .parents()
            .eq(3)
                .removeClass('active')
                .find('.info-texte, .info-btn')
                    .removeClass('debug')
                    .addClass('hidden');
    });

您可以在此处查看实际操作:http://www.jeremybarbet.com/effect/bug.html

最佳答案

根据我的意见,您的 $this.parents().eq(3) 定位了错误的元素

如果您将其更改为 $this.parents('li.active')

你的两个 div 应该消失:

http://jsfiddle.net/TDsCT/

编辑

经过仔细检查,这是因为您的点击:

$('#gallery').on('click', 'li'

当您单击按钮时也会触发此事件,因为该按钮位于您的 #gallery li 中。我已经更改了您的代码,因此您点击图片而不是打开,然后点击您的按钮关闭:

http://jsfiddle.net/TDsCT/5/

关于javascript - 使用 jQuery 从两个元素中删除类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16463561/

相关文章:

javascript - 在多个页面上使用按键导航脚本

HTML 子菜单

javascript - 如何选择表格中的列

javascript - 在ubuntu中为ionic设置环境变量

javascript - 如何使用javascript onclick创建表单元素输入框,标签

javascript - 找不到 AngularJS 指令外部模板

javascript - Html 上的键绑定(bind)

javascript - 仅当存在一个或多个相关项目时才显示 slider

javascript - 从 HTML 调用脚本中的方法。该脚本在 HTML 中间接引用

jquery - 使用 jQuery 浏览文件系统并在跨度中显示图像