JS/jQuery函数意味着只重复一次触发器

JS/jQuery Function meant to repeat triggers only one time

本文关键字：触发器 一次 jQuery 函数 意味着 JS      更新时间：2023-09-26

我想用jQuery制作一个简单的横幅旋转器。我想让它循环，但问题是它只在页面加载后立即触发，而不是从那以后。

下面是我的代码: 
var stop = false;
var tar = 1;
function slide(){
    if(!stop){
        switch(tar){
            case 1:
            jQuery("#um1").toggle(300, function(){jQuery("#um2").toggle(300);});
            tar=2;
            break;
            case 2:
            jQuery("#um2").toggle(300, function(){jQuery("#um3").toggle(300);});
            tar=3;
            break;
            case 3:
            jQuery("#um3").toggle(300, function(){jQuery("#um1").toggle(300);});
            tar=1;
            break;
        }
    }
}
jQuery(function(){
    jQuery("#logosect").mouseenter(function(){ stop=true; });
    jQuery("#logosect").mouseleave(function(){ stop=false; });
    window.setInterval(slide(), 5000);
});

你需要传递一个函数引用setInterval()，在你的情况下，slide()被调用时，你调用setInterval()，并通过它返回的值(在这种情况下未定义)作为回调setInterval

window.setInterval(slide, 5000);

对于性能问题，我推荐使用clearInterval。

var tar = 1;
var slideInterval;
function slide(){
        switch(tar){
            case 1:
            jQuery("#um1").toggle(300, function(){jQuery("#um2").toggle(300);});
            tar=2;
            break;
            case 2:
            jQuery("#um2").toggle(300, function(){jQuery("#um3").toggle(300);});
            tar=3;
            break;
            case 3:
            jQuery("#um3").toggle(300, function(){jQuery("#um1").toggle(300);});
            tar=1;
            break;
        }
}
jQuery(function(){
    jQuery("#logosect").mouseenter(function(){ 
         clearInterval( slideInterval );
    }).mouseleave(function(){ 
        slideInterval = window.setInterval(slide, 5000);
    }).trigger("mouseleave");

});
相关文章：