我正在使用一个自动完成搜索框的项目.现在我有一个问题,我想把值从发现的自动完成结果传递到输入框,但同时,我希望autocompleteBox隐藏的时候,输入框不是更加集中.
现在我有两个冲突,因为点击autocompleteBox被看作是聚焦,并隐藏框,即使它可以传递的价值.任何针对这种问题的指针或解决方法?这里有一个jsfiddle让你更清楚.
或者在这里
CSS:
#a_c {display:none;}
JS:
$('#search_field').focusout(function() { $('#a_c').hide(); // IF I DELETE THIS IT WORKS }); $('#search_field').focusin(function() { $('#a_c').show(); }); $('#a_c a').click(function() { $('#search_field').val(''); var value = $(this).text(); var input = $('#search_field'); input.val(input.val() + value); $('#a_c').hide(); return false; });
HTML:
<input autocomplete="off" onkeyup="searchFor(this.value);" name="search" id="search_field" class="bold" type="text" placeholder="Search..."> <div id="a_c"><a href="">hello world</a></div>
解决方法
在类似情况下我的解决方案是使用超时暂时阻止在模糊事件处理程序中采取的操作.喜欢这个:
$('#search_field').focusout(function() { window.setTimeout(function() { $('#a_c').hide() },100); });