Question

由于某种原因，这不是每4秒在post类上添加和删除一个新类。 jquery正确加载，就像这样。 chrome显示代码没有错误。

$(document).ready(function(){
    $('.post').addClass('display').delay(4000).removeClass('display');
});

Answer 1

由于您列出了您希望每4秒发生一次，您只需使用setInterval()

即可

var $post = $(".post");
setInterval(function(){
    $post.toggleClass("display");
}, 4000);

注意，选择器缓存在$post中，以最大限度地减少每个时间间隔内查询DOM所需的次数。

<强> Example on jsfiddle

Answer 2

假设您想在四秒钟后切换班级名称：

setTimeout(function(){
   $('.post').toggleClass('display');
},4000);

JS Fiddle demo

为了切换每四秒钟（虽然@Mark已经发布了setInterval选项，但我将其添加到我的帖子中。...我要离开了，但是我承认Mark先得到了它：

setInterval(function(){
   $('.post').toggleClass('display');
},4000);

JS Fiddle demo

参考文献：

Answer 3

.delay仅适用于其他动画方法，不适用于addClass或removeClass。试试这个：

$('.post').addClass('display');
setTimeout(function(){ $('.post').removeClass('display'); },4000);

如果您希望继续添加和删除，则需要获得更多创意。您可以使用setInterval和8000毫秒的延迟，但这也会延迟第一个addClass。另一种方法是使用嵌套的setTimeouts和递归函数调用（以及toggleClass来缩短代码）：

function addRemoveClass() {
    var delay = 4000; // milliseconds
    setTimeout(function() {
        $('.post').toggleClass('display');
        addRemoveClass();
    }, delay);
};
addRemoveClass();

http://jsfiddle.net/mblase75/jU8cj/

（将其设置为1000毫秒并将.display设置为透明，瞧 - you've just re-invented the blink tag。）

Answer 4

我想你想要更像的东西：

$(document).ready(function(){  
  setInterval(addRemoveClass,4000); 
});

function addRemoveClass() {
   $('.post').toggleClass('display');
}

Answer 5

您只能在jQuery中使用delay queued次操作。幸运的是，将一个项添加到队列中相对简单：

$(selector).delay(duration).queue(function (next) {
    $(this).doStuff();
    doOtherStuff();
    next();
});

提供给函数的参数是一个告诉队列继续的函数，以防您想要执行异步操作，例如使用$.ajax。

要获得循环，只需重新排队排队的函数：

jQuery(function ($) {
    "use strict";
    function toggleDisplayClass(next) {
        $(this).toggleClass('display')  //toggles the class
            .delay(4000)                //waits 4 seconds
            .queue(toggleDisplayClass); //requeued
        next();                         //continues on the queue
    }
    $('.post').queue(toggleDisplayClass);
});

您可以在my updated fiddle上看到这一点。

Answer 6

类似的东西：

jQuery(document).ready(function($) {  // ready
        var refresh=function(){

        $('.post').toggleClass('display'); //switch

                 }//end refresh
    setInterval(refresh,4000);
});

Answer 7

.delay()只会延迟动画，而不是功能。您可以使用JavaScript的原生setTimeout方法。

function toggleDisplay() {
    $('.post').toggleClass("display");
    setTimeout(function(){ toggleDisplay(); },'1000');
}
toggleDisplay();

如何每4秒在jquery中添加和删除一个类

7 个答案: