Question

JS：

setInterval(function(){ $("#nav #nextslide").click()},10000);

HTML：

<a href="site.html" class="gallery form_click">click.</a>

我希望将鼠标悬停在a按钮上，停止setInterval。

我该怎么做？

更新：感谢您的所有答案。所有解决静态结构的解决方案。但我的a标签是通过ajax获取的。所以，我认为必须选择。（jQuery版本2.0.3）对吗？

Answer 1

var interval = setInterval(function(){ $("#nav #nextslide").click()},10000);

并在悬停回调：

clearInterval(interval);

Answer 2

clearInterval()用于停止间隔。

使用事件委派作为a动态附加。

写：

var t = setInterval(function () {
    $("#nav #nextslide").click()
}, 10000);
$(document).on("hover","a",(function () {
    clearInterval(t);
});

DEMO here.

Answer 3

您可以设置间隔ID。以后，只要你想停止执行它就可以clearInterval。

ar refreshIntervalId = setInterval(function(){$("#nextslide").click()}, 10000);

/*On Hover */
$( ".gallery.form_click" ).mouseenter( function(){
clearInterval(refreshIntervalId);
})

Answer 4

在您的锚标记上尝试悬停和悬停功能，使您的间隔全局，以便它可以停止并开始：

var interval=setInterval(function(){ $("#nav #nextslide").click()},10000);
$( ".gallery" ).hover(
  function() {
      clearInterval(interval);
  }, function() {
     interval = setInterval(function(){ $("#nav #nextslide").click()},10000);
  }
);

如果代码是动态的，请使用jQuery on()：

var interval=setInterval(function(){ $("#nav #nextslide").click()},10000);
$( ".gallery" ).on(
  mouseenter: function() {
      clearInterval(interval);
  },
  mouseleave: function() {
     interval = setInterval(function(){ $("#nav #nextslide").click()},10000);
  }
);

并且仅在悬停时停止：

$('.gallery').on("hover",(function () {
    clearInterval(interval);
});

Answer 5

只需给间隔函数一个名称，以便稍后可以使用.clearInterval来引用它。

启动间隔功能：

nameOfIntervalFunction = setInterval(function(){$("#nav #nextslide").click()},10000);

使用悬停停止间隔功能：

$( "a.gallery.form_click" ).mouseenter( function(){
    window.clearInterval(nameOfIntervalFunction)
})

通过jQuery在hover上添加stop to setInterval

5 个答案: