Question

当一个div悬停在上面时，我正在显示一个标题，我想在鼠标停留在div上时禁用该效果....所以用户必须在标题再次显示之前鼠标关闭。我可以用unbind来解决这个问题，但问题是它会杀死鼠标功能：

$('.lowerFrontStripRow img').hover(         

function(){
     $('.orbit-caption-bottom#bottomThumb'+$(this).data("thumbid")).slideDown();
     $('.lowerFrontStripRow img').unbind();
},

function(){
     $('.lowerFrontStripRow img').bind(hover);
     $('.orbit-caption-bottom').slideUp();

}

);

如何在鼠标关闭动作之前禁用？

谢谢，

艾伦。

Answer 1

只有这应该起作用

$('.lowerFrontStripRow img').hover(         

function(){
     $('.orbit-caption-bottom#bottomThumb'+$(this).data("thumbid")).slideDown();

},

function(){

     $('.orbit-caption-bottom').slideUp();

}

);

Answer 2

.unbind()的第一个参数是eventType所以：

$('.lowerFrontStripRow img').unbind('hover');

是取消绑定功能的正确语法。

顺便说一下，你可能要改变问题的整个方法。

Answer 3

您似乎想要做的是：

显示是否：

用户将鼠标悬停在元素上

如果满足以下任何条件，则禁用：

用户不再将鼠标悬停在元素上
用户开始将鼠标悬停在元素上后的一段时间。

首先，hover(...)是.on( 'mouseover' )和.on( 'mouseout' )的简写;它实际上绑定了这两个事件，你也必须解除这两个事件的绑定。您似乎还遇到多次调用鼠标悬停功能的问题？为什么不在元素上存储一些信息来防止这种情况呢？

$('.lowerFrontStripRow img').on( 'mouseover', function() {
    if( $(this).data( 'displaying' ) != 1 ) {
        $(this).data( 'displaying', 1 );
        $('.orbit-caption-bottom'+$(this).data("thumbid")).slideDown();
        setTimeout( function() { $('.orbit-caption-bottom').slideUp(); }, 3000 );
    }
} ).on( 'mouseout', function() {
    $(this).data( 'displaying', 0 );
    $('.orbit-caption-bottom'+$(this).data("thumbid")).slideUp();
} );

jQuery在悬停时取消绑定，在悬停时重新启用

3 个答案: