Jquery 在hover（）中延迟添加类2秒

如何在

addClass（）上使用easing或time delay

javascript的
setTimeout
方法可用于在设置毫秒延迟后运行指定的代码

试试这个：

var timeout;
$("#date_1").hover(
    function () {
        $(this).addClass("door");
        timeout = setTimeout(function() { $(this).addClass("doorstatic"); }, 2000);
    }, function () {
        clearTimeout(timeout);
        $(this).removeClass("door doorstatic");
    }
);

您可以将类分组，如
removeClass（“door door static”）

这里的问题是，如果您将鼠标移到上面，并且在两秒钟之前将鼠标移出，那么元素上仍然会有类
doorstatic

修复方法：

$("#date_1").hover(    
    function () {
        var $this = $(this),
            timer = $this.data("timer") || 0;

        clearTimeout(timer);
        $this.addClass("door");

        timer = setTimeout(function() {
            $this.addClass("doorstatic");
        }, 2000); // 2000 is in mil sec eq to 2 sec.

        $this.data("timer", timer);
    },
    function () {
        var $this = $(this),
            timer = $this.data("timer") || 0;

        clearTimeout(timer);
        $this.removeClass("door doorstatic");
    }
);

在
上创建了一个解决方案的实例，实际上您只需将调用附加到您的
addClass
调用即可

差不多

 $(this).addClass("door").delay(2000).addClass("doorstatic", "slow"); 

应该可以了。
addClass
不接受像“slow”这样的第二个字符串参数。“doorstatic”类可能会在鼠标悬停（鼠标进入）2秒后添加，即使您选择在这2秒之前移除鼠标（鼠标离开）。但我有几个。。我基本上有一个日历，有一排盒子。。用户可以使用鼠标和流在许多。。。在第页上，eac旁边有不止一个盒子。很好！就像使用
data（）
和
|
操作符：）一样，当他将计时器与当前（此）元素一起存储时，它应该可以在几个元素上工作。不过，您必须为悬停事件使用新的选择器。addClass方法中没有第二个参数。我认为延迟在那里不起作用。@OptimusCrime~jqueryui扩展了
.addClass（）
方法（以及其他一些方法）来支持动画。
$("#date_1").hover(    
    function () {
        var $this = $(this),
            timer = $this.data("timer") || 0;

        clearTimeout(timer);
        $this.addClass("door");

        timer = setTimeout(function() {
            $this.addClass("doorstatic");
        }, 2000); // 2000 is in mil sec eq to 2 sec.

        $this.data("timer", timer);
    },
    function () {
        var $this = $(this),
            timer = $this.data("timer") || 0;

        clearTimeout(timer);
        $this.removeClass("door doorstatic");
    }
);

 $(this).addClass("door").delay(2000).addClass("doorstatic", "slow");