Question

我有一个带滚动条的div。使用Firefox时，当我点击滚动条向下拖动它以查看div列表时，模糊事件被触发并隐藏我设置为在模糊被触发时隐藏的div。如何在使用滚动条时防止模糊：

$("#mydiv").blur(function () {
    $('#mydiv').fadeOut();
    console.log("fadeout blur");
});

我使用以下方式显示此div：

 $('#mydiv').fadeIn();

当我尝试点击滚动条时，我希望div在隐藏时隐藏但不隐藏。

Answer 1

可能这就是你要找的东西

$(document).ready(function(){
        $('#mydiv').fadeIn();   

        $("body").bind('click', function(ev) {
        var myID = ev.target.id;
        if (myID !== 'mydiv') {
            $('#mydiv').fadeOut();
        }
    });
});

这会将click事件与body绑定，并检查触发click事件的元素的id。如果它与DIV不匹配，div将被关闭，否则div将始终打开。

Answer 2

你可以这样做：

$(window).scroll(function() {
   $('#mydiv').css('display','block');
});

Answer 3

var scrolling = false, scrollingTimeout, blurTimeout;

$(window).scroll(function () {
    if (scrollingTimeout) {
        clearTimeout(scrollingTimeout);
    }
    scrolling = true;

    scrollingTimeout = setTimeout(function(){
        scrollingTimeout = null;
        scrolling = false;
    }, 300);
});
$("#mydiv").blur(function () {
    var that = $(this);
    if (!scrolling) {
        that.fadeOut();
    } else {
        if (blurTimeout) {
            clearTimeout(blurTimeout);
        }
        blurTimeout = setTimeout(function () {
            blurTimeout = null;
            that.focus();
        }, 600);
    }
});

请参阅jQuery scroll() detect when user stops scrolling和Can I declare logic on jQuery for the start and end of a scrolling event?

Answer 4

看起来你的滚动条没有形成在div＆amp;点击它会导致调用模糊。请检查用于显示div的用于显示滚动的css /样式正在做你期望的事情（在div中形成滚动条），如果是这种情况，那么在两者（div＆amp; scroll bar）＆amp;上使用父div。在包含两者的父div上使用focusOut / blur事件。

div滚动条上的Jquery Blur事件

4 个答案: