jquery - 禁用悬停jquery上的点击触发器

Question

我将滑块设置为每 5 秒单击一次下一个按钮，方法是使用setInterval. 我的计划是，当您将鼠标悬停在图像上时，此点击停止。我能想到的唯一方法是写一个新setInterval的悬停时间太长以至于什么都不会发生。但这不起作用，因为它不会覆盖原来的。

有没有办法在 jQuery 中做到这一点？我要做的就是停止悬停时的点击触发器....

     setInterval(function() {
      jQuery('.next_button').trigger('click');
    }, 1000);       

$(".main-slide img").hover(function () {

    setInterval(function() {
    jQuery('.next_button').trigger('click');
    }, 60000000);   

    },
function() {
    setInterval(function() {
     jQuery('.next_button').trigger('click');
    }, 1000);
    }
    );

Answer 1

您可以使用标志，当鼠标悬停在元素上时设置它，并在鼠标离开元素时取消设置，并在触发点击之前检查它：

var mouse_is_over = false;

setInterval(function () {
    if (!mouse_is_over) $('.next_button').trigger('click');
}, 1000);

$(".main-slide img").on('mouseenter mouseleave', function(e) {
    mouse_is_over = e.type == 'mouseenter';
});

Answer 2

创建具有 click 函数定义的函数，然后：

$('.element').hover(
        function(){
            $(this).unbind('click')

        },function(){
            $(this).click(function(){
                definedBeforeClickFunction();

            });
        });

这样你就不需要清除间隔。

Answer 3

试试这个，

 $(document).ready(function(){
  slider();
    function slider(){
 var t =  setInterval(function() {
  jQuery('.next_button').trigger('click');
   }, 1000);  
 }     

$(".main-slide img").hover(function () {

  clearInterval(t);
}
   $(".main-slide img").mouseout() {
   slider();
 }
); 

 });

Answer 4

您是否要删除 setinterval ？

然后尝试

var p = setinterval(function(){ //code  },time);

之后

clearInterval(p);