jquery addClass 和 removeClass 与 setInterval

发布于 2025-01-01 09:56:53 字数 408 浏览 1 评论 0原文

我想每 3 秒更改一次类名。但这不起作用。我该怎么做？

$(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;
    });

原文

I want to change class name every 3 seconds. Bu it doesn't work. How can I do this?

$(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;
    });

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

月下客 2025-01-08 09:56:53

您可以在一行中完成此操作。使用 toggleClass：

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

如果你的 CSS 正确，你不需要删除 liveEvents类。只需让 liveEventsActive 类覆盖您需要的内容即可。

You can do this in one line. Use toggleClass:

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

If you do your CSS correctly, you don't need to remove the liveEvents class. Just make the liveEventsActive class overwrite what you need.

回复收藏 0 原文

辞旧 2025-01-08 09:56:53

每次函数运行时，您都会执行四件事，这实际上会将您带回到开始状态：

删除类 liveEvents
添加类 liveEventsActive
删除类 liveEventsActive code>
添加类 liveEvents

您想要打开/关闭这两个类，因此请查看 .toggleClass() 函数。您还需要两个选择器，一个用于选择具有 liveEvents 类的元素，另一个用于选择具有 liveEventsActive 类的元素。

回复收藏 0 原文

怼怹恏 2025-01-08 09:56:53

对于您的代码，整个函数每 3 秒执行一次。添加/删除类发生在一个块中，您显然看不到区别。

jQuery 有一个 .toggleClass() 方法，该方法将相应地添加/删除指定的类：

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

< a href="http://jsfiddle.net/didierg/8GqXv/" rel="nofollow">演示

With your code, the whole function is executed every 3 seconds. The add/remove class happens in one block and you obvisouly cannot see the difference.

jQuery has a .toggleClass() method that will add/remove the specified class accordingly:

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

DEMO

回复收藏 0 原文

漆黑的白昼 2025-01-08 09:56:53

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

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

这将使用转换来交换您的课程，希望这会有所帮助

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

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

this will swap your classes using transitions, hope this will help

回复收藏 0 原文

~没有更多了~