Jquery 如果单击某个元素，则不需要在输入时激活.blur（）

我一直在写我自己的自动建议，而不是仅仅填写表单输入，它实际上生成了一个链接和图片的HTML列表，它直接从AJAX请求中获得。我遇到的一个问题是，如果输入失去焦点，我需要隐藏生成的列表，但是如果您尝试单击生成的列表中的链接，并且该链接在未注册单击的情况下消失，也会发生这种情况

这是我的密码：

var delay = false;
var landing = $('#suggestions');
$('#suggest').keyup(function(e) {   
    if (e.keyCode > 40 || e.keyCode == 8) { //If a letter or backspace
        if(this.value.length >= 3) { // if > 3 characters in the input
            $(this).addClass('loading');
            clearTimeout(delay);
            var query = this.value;
            delay = setTimeout( function() {
                $.ajax({
                    url: '/response.php', //returns HTML
                    type: 'get',
                    data: { 'q' : query },
                    dataType: 'html',
                    success: function(data) {
                        $('#suggest').removeClass('loading');
                        landing.show().html(data);
                    }
                });
            }, 200);

        } else {
            landing.empty();
        }
    }

})

.focus(function() {
    if($(this).val() == 'Search...') {
        $(this).val('');
    }

    if($(this).length) {
        landing.show();
    }
})

.blur(function() {
    if(this.value.length) {
        setTimeout(function() {
            landing.hide();
        }, 150)
    } else {
        $(this).val('Search...');
    }
})

.attr('autocomplete', 'off');

.blur（）就是问题产生的地方，我试图添加一个超时，但这被证明是非常不可靠的

此外，如果您对我目前所写内容有任何改进意见/建议，我们将不胜感激

经过大量实验，我提出的最佳解决方案是在

#suggestions

landing

上切换一个“persist”变量，因此如果用户在#suggestions（建议）框中执行某项操作，“blur（）``将不起任何作用：

$('#suggest').blur(function() {
    if(this.value.length) {
        if(landingPersist == false) {
            landing.hide();
        }
    } else {
        $(this).val('Search Knowledge Base');
    }
})

$('#suggestions').mouseover( function() {
    landingPersist = true;
})

.mouseout(function(){
    landingPersist = false;
});

这个方法不需要live（）或计时器，我认为这是一件好事。 检查

的
blur（）
中的persist变量

。首先，添加全局变量（在任何函数之外），如下所示：

var _hideLandingTimer = 0;

第二，在模糊中更改代码：

_hideLandingTimer  = setTimeout(function() {
            landing.hide();
        }, 150);

最后，我要说：

$('#suggest a').click(function() {
   window.clearTimeout(_hideLandingTimer);
});

这将清除计时器（因此不会隐藏着陆），以防单击链接，

首先，添加全局变量（在任何函数之外），如下所示：

var _hideLandingTimer = 0;

第二，在模糊中更改代码：

_hideLandingTimer  = setTimeout(function() {
            landing.hide();
        }, 150);

最后，我要说：

$('#suggest a').click(function() {
   window.clearTimeout(_hideLandingTimer);
});

---

这将清除计时器（因此不会隐藏着陆点），以防单击链接，

我必须使用

live（）

一方面，我也尝试了鼠标向下而不是单击，但如果按住鼠标一秒钟或右键单击，建议框仍会消失。越来越近，但只要单击链接，模糊（）就会消失触发并重新启动timer@Dun只需将单击和鼠标绑定到。。简单的测试用例证明了这个概念本身是有效的：感谢您的努力！我想出了另一个不涉及计时器的解决方案，我在mouseover/mouseout上切换“landingPersist”变量，如果鼠标在#建议框上，模糊将不会做任何事情。唯一的副作用是，如果他们右键单击，然后什么都不做，框将再次保持，直到他们激活#suggest上的blur（）。非常感谢您的帮助和建议，我将以此作为答案@邓为找到更好的解决方案而欢呼，并感谢您的好意！：-）我不得不使用

live（）

一件事，我也尝试了鼠标向下而不是单击，但是如果你按住鼠标一秒钟或右键单击，建议框仍然会消失。越来越近，但只要我单击一个链接，blur（）就会触发并重新启动timer@Dun只需将单击和鼠标绑定到。。简单的测试用例证明了这个概念本身是有效的：感谢您的努力！我想出了另一个不涉及计时器的解决方案，我在mouseover/mouseout上切换“landingPersist”变量，如果鼠标在#建议框上，模糊将不会做任何事情。唯一的副作用是，如果他们右键单击，然后什么都不做，框将再次保持，直到他们激活#suggest上的blur（）。非常感谢您的帮助和建议，我将以此作为答案@邓为找到更好的解决方案而欢呼，并感谢您的好意！：-）