Jquery blur（）对输入和div的影响

因此，我使用自动提示框构建输入字段，该框根据用户对字段的部分输入提供内容。有点像堆栈上的标签框。自动提示框绝对位于输入字段的正下方，并且只有在用户开始键入文本后才会出现。Jquery blur（）对输入和div的影响

我想在输入框模糊时使框消失，也就是说，当用户单击网站上的任何其他位置时。通常，我只是使用jQuery的blur()函数来隐藏自动提示框。问题是，如果我这样做，用户将无法从自动提示框中选择任何内容，因为这会模糊输入字段并隐藏自动提示框。我需要找到一种方法来隐藏自动提示框，如果用户单击除输入框或自动提示框以外的任何地方。任何想法如何使用jquery设置它？

想象一下，这是设置是这样的：

<div id="auto_suggest"> 
<ul> 
<li>Jane</li> 
<li>john</li> 
</ul> 
</div> 

<input type="text">

来源

2012-06-21 Thomas

使用超时。

$("input, #auto_suggest, #auto_suggest a").blur(function() { 
    $('#auto_suggest').addClass('hiding'); 
    setTimeout(function(){ 
     $('#auto_suggest.hiding').hide(); 
    },1000); 
}).focus(function() { 
    $('#auto_suggest').removeClass('hiding').show(); 
}); 

$('#auto_suggest, #auto_suggest a').focus(function() { 
    $('#auto_suggest').removeClass('hiding').show(); 
});

更新与标签或点击效果很好，

http://jsfiddle.net/iambriansreed/vUeeT/

来源

2012-06-21 20:46:17

相当聪明。 +1 :) –

哇，这很聪明... – Thomas

当他点击自动完成框中的链接时，它会模糊输入，并在实际点击出现在框内目标上之前移除自动完成框。该解决方案工作正常，无需定义或清除超时; setTimeout不是setInterval。 – iambriansreed

Jquery blur（）对输入和div的影响

回答

相关问题