如何在悬停时停止和启动此功能答案

【问题标题】：How do I stop and start this function on hover如何在悬停时停止和启动此功能
【发布时间】：2012-12-28 03:23:54
【问题描述】：

我想在容器 div 的悬停上停止和启动一个函数，我尝试了 myLoop.stop();重置变量，但它不能正常工作......有什么想法？？？

    //Continuous Scroll
var nex = 1;
var timeInterval = 1000;
$(".logoContainer").hover(function(){
    // Stop Function Here

},function () {
    // Start Function Here
})
function myLoop () { //  create a loop function
setTimeout(function () {    //  call a 3s setTimeout when the loop is called
  if( cache.isAnimating ) return false;
  cache.isAnimating = true;
  aux.navigate( 1, $el, $wrapper, settings, cache );
  nex++; 
  if (nex < 100) {
    myLoop(); 
   }  
  }, timeInterval)
 }
myLoop();

【问题讨论】：

我总是接受对我的问题有帮助或能正确解决问题的答案
如果没有其他人的答案可以解决您的问题，您应该发布自己的答案并接受，或者提供赏金，或者删除问题。或者，就像您的情况一样，返回并改进您的问题，使其更具体或更清晰，以便得到您满意的回答。
在这个问题的情况下，您应该提供一些示例 HTML 和/或有效的fiddle，以便我们可以重现您的问题，并明确说明“不起作用”的意思正确的”。 Formatting your code cleanly 也会帮助我们。帮助您越容易，您获得的帮助就越多！

标签： javascript jquery function intervals

【解决方案1】：

我建议在你的 setTimeout 函数中放置一个标志，并根据你想要的事件更改这个标志，看看这个： http://api.jquery.com/hover/

您的代码可能需要一些重构，像这样的东西（伪代码）怎么样：

function callThisFunctionEveryXSeconds(){
    if(continueFlag){
        keepScrolling();
    }
}
$(someDiv).mouseenter() { continueFlag = true; }
$(someDiv).mouseleave() { continueFlag = false; }

【讨论】：

能否详细说明一下标志的含义，例如示例代码，谢谢
$(".logoContainer").hover(function(){ timeInterval = 25000; },function () { timeInterval = 1000; })
我尝试使用它作为标志，但我需要能够在 mouseout 时将间隔更改回 1000，但它会继续运行 25 秒的过程，然后变回......从那时起？
好吧，如果你通过 jQuery 制作动画，你可以使用 stop() 函数，它会停止任何正在进行的动画：api.jquery.com/stop
但是对于你目前拥有的代码clearInterval() 应该更合适，在这里检查这个问题：stackoverflow.com/questions/8443151/…

【解决方案2】：

使用clearTimeout 停止setTimeout。

var nex = 1;
var timeInterval = 1000;
$(".logoContainer").hover(function(){
        looper.stop();

    },function () {
        looper.start();
    });

function myLoop () { //  create a loop function
    var timeout;
    this.start = function(){
        timeout = setTimeout(function () { 
            cache.isAnimating = true;
            aux.navigate( 1, $el, $wrapper, settings, cache );
            nex++; 
            if (nex < 100) {
                myLoop(); 
            }  
        }, timeInterval);
    }
    this.stop = function () {
        clearTimeout(timeout);
    }
}
var looper = new myLoop()

【讨论】：

得到这些错误：Uncaught TypeError: Cannot call method 'stop' of undefined jquery.contentcarousel.js:223 (anonymous function) jquery.contentcarousel.js:223 jQuery.event.special.(anonymous function ).handle jquery-latest.js:3344 jQuery.event.dispatch jquery-latest.js:3058 elemData.handle.eventHandle jquery-latest.js:2676 Uncaught TypeError: Cannot call method 'start' of undefined jquery.contentcarousel.js :225 (匿名函数) jquery.contentcarousel.js:225 jQuery.event.special.(匿名函数).handle jquery-latest.js:3344 jQuery.event.dispatch jquery-latest.js:3058 elemData.handle
我认为你指向 this.start 的地方没有指向正确的元素
抱歉，我忘了创建 myLoop 的实例。
好的，我知道你在这里做了什么，但是除非你将鼠标悬停在上面，否则我需要运行动画直到你悬停，所以这在理论上是向后的 LOL
嘿，感谢您与我合作，我尝试了很多方法，但不得不使用另一种方法，因为它一直在向后工作！但你很有帮助。我发布了对我有用的代码再次感谢您！

【解决方案3】：

好的，我必须更改结束函数的变量，然后在 mouseout(hoverOut) 上重置并再次触发：

 //Continuous Scroll
var nex = 1,timeInterval = 1000,loop = 0;
function myLoop () { //  create a loop function
    setTimeout(function () {    //  call a 3s setTimeout when the loop is called
        if( cache.isAnimating ) return false;
            cache.isAnimating = true;
            aux.navigate( 1, $el, $wrapper, settings, cache );
            nex++; 
        if (nex < 100) {
            myLoop(); 
        }  
        }, timeInterval)
    }
myLoop();

$(".logoContainer").hover(function(){
    nex = 100;
},(function(){
    nex = 1;
    myLoop();
        })
);

【讨论】：