Jquery改变blur和click的执行顺序

分类: 前端  • 发布时间: 2013-11-09 12:42:00  • 浏览量:9855

昨天遇到一个问题,需求是这样的:

一个input输入框,当他获得焦点时,在他下方显示出来一个div,当他失去焦点时这个div要消失。同时div内部有span和a包围的内容,当点击a时,链接跳转,同时div消失,当点击span时,span里面的内容在input上显示。

刚开始很简单的想到了用:定位、focus、blur、click来处理,input获得焦点时让div显示,失去焦点时div消失,很快搞定,

但是当点击div的东西木效果,后来想想,原来是因为当你click显示出来的div时,好像先执行的是input的blur事件,然后才执行div的click,具体原因是什么我也不太懂(俺是超级新手啊),可能是因为js单线程的吧,

这时想到用延迟来改变执行顺序,用setTimeout搞了半天,没成功。百撕不得骑姐啊!后来想到jquery有个delay可以做延时,不过好像只能用来处理动画延时,不过呢隐藏一个div我们可以用display:none控制,但是jquery动画中也提供了一个hide,很显然这个可以搞定,一试果然行,不过呢延时时间低于100毫秒就不行,99都不行啊! 

$('.ipt').blur(function(){ 
    $('#ipt').delay(100).hide(100); 
});


文章标签: jquery, javascript, blur, click