Question

我有

<script>
function myfunc(){
alert("show this alert in 5000ms after toggleClass executed")
//some code goes here
}

$(document).ready(function(){
    $('.mybtn').on('click',function(){
        $('#mydiv').toggleClass('newclass');
    });
 });
</script>

如何在执行toggleClass后的5000ms内执行myfunc()？尝试了几种方法，但没有运气。

谢谢。

Answer 1

使用setTimeout()

function myfunc() {
    alert("show this alert in 5000ms after toggleClass executed")
    //some code goes here
}

$(document).ready(function () {
    $('.mybtn').on('click', function () {
        $('#mydiv').toggleClass('newclass');
        setTimeout(myfunc, 5000)
    });
});

Answer 2

试试这个......

function myfunc(){
alert("show this alert in 5000ms after toggleClass executed");
//some code goes here
}

$(document).ready(function(){
    $('.mybtn').on('click',function(){
        $('#mydiv').toggleClass('newclass').delay(5000).queue(myfunc);        
    });
});

JSFIDDLE DEMO

Answer 3

使用settimeout功能

function myfunc() {
    alert("show this alert in 5000ms after toggleClass executed")
    //some code goes here
}

$(document).ready(function () {
    $('.mybtn').on('click', function () {
        $('#mydiv').toggleClass('newclass');
        setTimeout(myfunc, 5000)
    });
});

Answer 4

你可以拥有像这样的回调函数

$('#mydiv').toggleClass('newclass', 5000).promise().done(function(){alert("done")});

这是一个有效的demo

Answer 5

我会在另一个事件中执行$("#mydiv").toggleClass('newclass')。

例如<button class="mybtn" onmousedown="$('#mydiv').toggleClass('newclass')" onclick="myfunc();">Fast Toggle</button>

如果您点击onmousedown，则会在点击事件触发前使用切换进行渲染。

jQuery：执行一个函数AFTER toggleClass被执行

5 个答案: