Question

我甚至看过这个，这个解决方案仍然没有帮助我：Execute a function after X seconds in jquery

这是我的代码：

// featured bounce
$('#featured .animated').hover(function() {
    $(this).addClass('bounce');
    setTimeout( function(){
        $(this).removeClass('bounce');},
        1300
    );
});

添加类有效，但setTimeout考试不起作用。它甚至不会执行，也不会在Chrome控制台中引发javascript错误。我觉得我输入的内容都正确..在addClass（）之后的.animated对象上的类看起来像这样：

“动画反弹”

动画播放，但之后它永远不会从类属性中删除“反弹”。

任何帮助？

Answer 1

正确使用Function.prototype.bind，您可以避免像var that = this这样的廉价上下文黑客攻击。

// featured bounce
$('#featured .animated').hover(function() {
    var elem = $(this);
    elem.addClass('bounce');
    setTimeout(elem.removeClass.bind(elem, 'bounce'), 1300);
});

备注：Function.prototype.bind是ES5的补充，需要考虑浏览器支持。请参阅有关该函数的MDN文章底部的兼容性表。

Answer 2

这个范围指的是窗口，而不是你期望的元素。

$('#featured .animated').hover(function() {
    var elem = $(this);
    elem.addClass('bounce');
    setTimeout( function(){
        elem.removeClass('bounce');},
        1300
    );
});

Answer 3

$('#featured .animated').hover(function() {
    $(this).addClass('bounce');
    (function(that) {
        setTimeout( function(){
            // use `that` instead of `this`
            $(that).removeClass('bounce');
        }, 1300);
     })(this); //pass `this` into this function
});

setTimeout不会执行该函数

3 个答案: