Question

我尝试在点击时将一个类附加到div，并在第二次单击时将其删除我目前拥有此脚本 -

    $(".project").click(function(){
        if ($(".project-expand", this).is(':visible')) {
            $(".project-expand",this).hide(1000);
            $('.project').delay(1000).queue(function(){
            $(".project").removeClass('item-dropped').clearQueue();
          });
        } else if ($(".project-expand", this).is(':hidden')) {
            $(".project-expand").hide(1000);
            $(".project-expand",this).show(1000);
            $(".project").addClass('item-dropped');
        }
    });

但这增加了＆＃34;项目掉落＆＃34;我所有的div都有一个班级＆＃34;项目＆＃34;当我将代码更改为 -

时

$(".project", this).addClass('item-dropped');

它没有做任何事情，我在哪里错了？

Answer 1

您可以简单地使用点击事件的目标（$('.project')），而不是使用类选择器$(this)：

$(".project").click(function () {
    var project = $(this);
    var projectExpand = $(".project-expand", this);

    if (projectExpand.is(':visible')) {
        projectExpand.hide(1000);
        project.delay(1000).queue(function () {
            project.removeClass('item-dropped').clearQueue();
        });
    } else if (projectExpand.is(':hidden')) {
        $(".project-expand").hide(1000);
        projectExpand.show(1000);
        project.addClass('item-dropped');
    }
});

其他信息：您尝试做的原因之所以没有原因，是因为$('.project', this)在当前元素中查找具有类project的元素（即在项目中查找项目）

Answer 2

您必须使用$（this）在点击的项目上添加课程：

        $(".project").click(function(){
            if ($(".project-expand", this).is(':visible')) {
                $(".project-expand",this).hide(1000);
                $(this).delay(1000).queue(function(){
                $(this).removeClass('item-dropped').clearQueue(); // Here
              });
            } else if ($(".project-expand", this).is(':hidden')) {
                $(".project-expand").hide(1000);
                $(".project-expand",this).show(1000);
                $(this).addClass('item-dropped'); // Here
            }
        });

Answer 3

你必须使用：

$(this).addClass('item-dropped');

concept fiddle

jQuery使用＆＃39;这个＆＃39;添加/删除类

3 个答案: