所以我正在构建一个带有自动建议框的输入字段,该框根据用户对该字段的部分输入建议内容。有点像堆栈上的标签框。自动建议框绝对位于输入字段的正下方,仅在用户开始输入文本时才会显示。
当输入字段模糊时,即当用户点击网站上的任何其他位置时,我想让框消失。通常,我只会使用jquery的blur()
函数来隐藏自动建议框。问题是,如果我这样做,用户将无法从自动建议框中选择任何内容,因为这会模糊输入字段并隐藏自动建议框。如果用户点击输入字段或自动建议框之外的任何地方,我需要找到隐藏自动建议框的方法。任何想法如何使用jquery设置它?
想象一下它的设置是这样的:
<div id="auto_suggest">
<ul>
<li>Jane</li>
<li>john</li>
</ul>
</div>
<input type="text">
答案 0 :(得分:4)
使用超时。
$("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();
});
已更新,可以很好地处理标签页或点击次数: