2

因此,我正在构建一个带有自动建议框的输入字段,该框根据用户对该字段的部分输入来建议内容。有点像堆栈上的标签框。自动建议框绝对位于输入字段的正下方,并且仅在用户开始输入文本时出现。

我想让框在输入字段模糊时消失,即当用户单击站点上的其他任何位置时。通常,我只会使用 jquery 的blur()功能来隐藏自动建议框。问题是,如果我这样做,用户将无法从自动建议框中选择任何内容,因为这会模糊输入字段并隐藏自动建议框。如果用户单击输入字段或自动建议框以外的任何位置,我需要找到一种方法来隐藏自动建议框。有什么想法可以使用 jquery 进行设置吗?

想象一下它是这样设置的:

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

<input type="text">
4

1 回答 1

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();
});​

更新为与选项卡或点击一起工作:

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

于 2012-06-21T20:46:17.130 回答