jquery - 取消绑定窗口滚动上的所有鼠标悬停事件

Question

我试过这段代码：

$(function(){
    $('.media-in').bind('mouseover',function(){
        $(this).children('.media-options').show();
    });
    $('.media-in').bind('mouseout',function(){
        $(this).children('.media-options').hide();
    });
    $(window).on('scroll',function(){
        $('.media-in').unbind('mouseover');
    });
});

它没有按预期工作。我想在滚动页面时unbind发生事件，mouseover我该怎么做？

另外，有没有办法unbind通过数组滚动页面上的事件？就像是：

$(window).scroll(function(){ 
    $(this).unbind(['mouseover','click','mouseout']);
});

Answer 1

从 jQuery 1.7 开始，它是绑定off()和on()取消绑定事件处理程序的首选方法。

因此，要从元素中删除所有处理程序，请使用以下命令：

$('.media-in').off();

或对于特定的处理程序：

$('.media-in').off('mouseover mouseout click');

Answer 2

您可以使用on()and off()，但是一旦事件处理程序被删除，一旦您停止滚动，它就不会神奇地返回，您必须使用 重新绑定它on()。

$(function(){
    var timer;
    media_bind();

    $(window).on('scroll', function(){
         clearTimeout(timer);
         $('.media-in').off('mouseover mouseout');
         timer = setTimeout(media_bind, 500);
    });

    function media_bind() {
         $('.media-in').on(
             mouseover: function() {
                 $(this).children('.media-options').show();
             },
             mouseout: function() {
                 $(this).children('.media-options').hide();
             }
         });
    }  
});