读书人

做搜索提示时jquery中focusout和click

发布时间: 2013-02-15 15:46:56 作者: rapoo

做搜索提示时jquery中focusout和click事件冲突问题
代码片段


<script>
j("ol li").click(function(){
j("#dataInput").val(j(this).find("span:first").html());
j("#sug").hide();
});

j("#dataInput").focusout(function(){
j("#sug").hide();
});
</script>
<input id="dataInput" type="text" />
<div id="sug">
<ol>
<li>
<span></span>
<span></span>
</li>
<li>
<span></span>
<span></span>
</li>
</ol>
</div>

当搜索提示层显示 用户点击其中一个li 就把第一个span中的内容放入input域中 但点击时由于触发了focusout事件 使得click事件失败 span内容无法填入input中,应该怎样解决

[解决办法]
这是我刚刚测试的全部代码,是可以填入值的,楼主,有兴趣可以试试看,大家多交流下,相信会有更好的方法。
#sug{width:200px;height:140px;background:#fff; display:none;}
#sug ol,li{margin:0;padding:0;}
#sug li{background:#f7f7f7;height:22px;border-bottom:1px solid #ccc;width:200px;}

$(function() {
$("ol li").click(function() {
$("#dataInput").val($(this).find("span:first").text());
$("#sug").hide();
});
$("#dataInput").keypress(function() {
$("#sug").slideDown();
}).blur(function() {
$("#sug").slideUp();
});
})

读书人网 >Ajax

热点推荐