onclick和onblur冲突问题的快速解决方法

《onclick和onblur冲突问题的快速解决方法》由会员上传分享，免费在线阅读，更多相关内容在学术论文-天天文库。

1、onclick和onblur冲突问题的快速解决方法下面小编就为大家带来一篇onclick和onblur冲突问题的快速解决方法。小编觉得挺不错的，现在分享给大家，也给大家做个参考新浪首页的搜索框里面有一个使用ajax的下拉框。我们需要实现一个点击下拉框里面的一项，让搜索框里面的值变成这一项，同时下拉框消失的效果，但同时在点击其他地方的时候，这个下拉框也要消失。大致如图：我们同时使用onblur和onclick来使下拉框隐藏，但是更大的问题出现了，这两个功能相冲突，onblur过于强悍，根本没有onclick方法实现的机会，搜索框无法获取点击项的内容。这个就是我们想要解决的o

2、nclick和onblur冲突问题。对应这个问题，这里我们介绍两种解决办法：1.使用setTimeout来使onblur时间延期执行，使onclick执行完后再执行onblur。（其中setTimeout的时间设定应该在100ms以上，否则依旧不行）示例代码如下:It;!D0CTYPEhtmlgt;It;htmlgt;It:headlang=〃en〃gt;nbsp;It;metacharset=〃UTF-8〃gt;nbsp:It:titlegt;It;/titlegt;nbsp;It;stylegt;nbsp;nbsp;氺{margin:O;padding:O;lists

3、tyle:none:}nbsp;nbsp:form{nbsp;nbsp;nbsp;width:500px;nbsp:nbsp;nbsp;margin:Oauto;nbsp;nbsp;nbsp;position:relative;nbsp;nbsp;nbsp;zoom:1:nbsp;nbsp;}nbsp;nbsp;form:after{nbsp;nbsp;nbsp;clear:both;nbsp;nbsp;nbsp;content:〃〃：nbsp:nbsp;nbsp;display:biock;nbsp;nbsp;}nbsp;nbsp;.text{nbsp;nbsp;nbs

4、p;float:left;nbsp;nbsp;nbsp;border:lpxsolidttcccccc:nbsp:nbsp:nbsp:padding-left:14px;nbsp;nbsp:nbsp;width:300px:nbsp;nbsp:nbsp;height:34px;nbsp;nbsp;nbsp;1ine-height:34px:nbsp:nbsp;nbsp;font-size:14px;nbsp;nbsp;}nbsp;nbsp;.button{nbsp;nbsp:nbsp;width:50px;nbsp;nbsp;nbsp;height:34px;nbsp:n

5、bsp;nbsp;border:lpxsolidttcccccc;nbsp;nbsp;nbsp;line_height:34px;nbsp;nbsp;nbsp;font-size:14px;nbsp;nbsp;nbsp;color:nbsp;nbsp;nbsp;background:#ff8400:nbsp;nbsp;}nbsp;nbsp;ul{nbsp;nbsp;nbsp;position:absolute;nbsp;nbsp;nbsp:top:36px;nbsp;nbsp;nbsp;left:0:nbsp;nbsp;nbsp;width:3OOpx;nbsp:nbsp

6、:nbsp:border~right:lpxsolidttcccccc:nbsp;nbsp;nbsp;border-left:lpxsolidttcccccc:nbsp;nbsp:nbsp;background:green;nbsp;nbsp;}nbsp;nbsp;li{nbsp;nbsp;nbsp;font-size:14px;nbsp;nbsp;nbsp;line-height:34px;nbsp;nbsp:nbsp;height:34px;nbsp;nbsp;nbsp;color:#000000;nbsp;nbsp:nbsp:border-bottom:lpxsol

7、idttcccccc;nbsp;nbsp;}nbsp;nbsp;li:hover{nbsp;nbsp;nbsp;background:yellow;nbsp;nbsp;nbsp;color:red;nbsp;nbsp;nbsp;cursor:pointer:nbsp;nbsp;}nbsp;It;/stylegt;nbsp;It;scriptgt;nbsp;nbsp;window.onload=function(){nbsp;nbsp;nbsp;varoText=document.getElementByldCtext’)；nb