jquery addClass和removeClass with setInterval

我想每3秒更改一次類名。它不起作用。我怎樣才能做到這一點？jquery addClass和removeClass with setInterval

$(document).ready(function() { 
     function moveClass(){ 
      var x = $('.liveEvents'); 
      x.removeClass('liveEvents'); 
      x.addClass('liveEventsActive'); 
      x.removeClass('liveEventsActive'); 
      x.addClass('liveEvents'); 
     } 

     setInterval(moveClass, 3000); 
     return false; 
    });

來源

2012-02-01 dr.linux

你可以在一行中做到這一點。使用toggleClass：

setInterval(function(){$('.liveEvents').toggleClass('liveEventsActive')}, 3000);

如果你正確地做你的CSS，你並不需要刪除liveEvents類。只需使liveEventsActive類覆蓋您所需的內容即可。

來源

2012-02-01 16:22:45

我認爲這將切換liveEventsActive類，而不是liveEvents，我錯了 – 2012-02-01 16:35:58

你是對的，但在「liveEventsActive」類中有適當的CSS聲明，你不需要。 – 2012-02-01 16:37:20

非常感謝您的信息。 – 2012-02-01 16:43:29

你做的每一個功能運行時，基本上可以回到你的啓動狀態的四件事：

刪除類liveEvents
添加類liveEventsActive
刪除類liveEventsActive
添加類別liveEvents

要打開/關閉這兩個類，請查看.toggleClass()函數。您還需要兩個選擇器，一個選擇liveEvents類的元素，另一個選擇liveEventsActive類的元素。

來源

2012-02-01 16:19:50

非常感謝您的信息。 – 2012-02-01 16:33:47

用你的代碼，整個函數每3秒執行一次。添加/刪除類發生在一個塊中，你顯然看不到差異。

jQuery有一個.toggleClass()方法，將相應的添加/刪除指定的類：

function moveClass() { 
    $('.liveEvents') 
     .toggleClass('liveEventsActive'); 
}

DEMO

來源

2012-02-01 16:23:56

非常感謝您的信息。 – 2012-02-01 16:45:00

$(document).ready(function() { 
    function moveClass(){ 
     $(".liveEvents").switchClass("liveEvents", "liveEventsActive", 1000); 
     $(".liveEventsActive").switchClass("liveEventsActive", "liveEvents", 1000); 
    } 

    setInterval(moveClass, 3000); 
    return false; 
});

這將交換使用轉換你的類，希望這將有助於

來源

2012-02-01 16:33:50

jquery addClass和removeClass with setInterval

回答

相關問題