jquery使用on给input绑定focus事件和alert组合后无限弹出

我们知道,jQuery中的on方法是可以无限触发的,当给input绑定了focus事件的时候,如果在focus事件中使用了alert弹出框的话,很容易就会造成死循环(无限弹出框)的现象。

原因是因为,jQuery的on绑定的这个focus事件是组合了onfocus(获取焦点)和onblur(失去焦点)两个JavaScript事件的,当alert弹出之后如果去点击弹出框的确认按钮就会触发onblur事件,可是在弹出框关闭之后焦点又回到了input输入框中,又触发onfocus事件,陷入了一个无限弹出的死循环中。

这个时候如果非要使用alert的话,最好的解决的办法就是不使用on绑定focus事件。

"一个萝卜一个坑。"

原文地址:https://www.cnblogs.com/yanggb/p/12402398.html

时间: 2024-08-01 22:28:06

jquery使用on给input绑定focus事件和alert组合后无限弹出的相关文章

针对jquery绑定click事件执行两次,layer弹出框,以及img的map属性应用。

前不久使用jQuery与layer实现一个弹出框,发现在绑定弹出框事件时,事件执行了两次,准确的说是方法同时注册了两次,不分先后执行了两遍,导致弹出框弹出两次.请教同事后,发现原因有可能是jQuery的js与layer的js冲突(具体原因还需要深入了解),通过网络和请教同事,得到了三种处理方法. 方法一:不采用jQuery进行事件的绑定,直接在标签中添加onclick事件. 方法二:采用这种方式$("#item_add_button")[0].onclick = function(){

jQuery 判断元素上是否绑定了事件

我研究了一下之后发现,jQuery都将事件缓存起来了,其实也是为了防止内存溢出以及页面unload的时候的速度,也包括多函数触发,方便管理等诸多好处,具体可以参考此文. jQuery会在window.unload的时候卸载所有绑定过的事件,释放内存的. OK,言归正传.判断元素上是否绑定过事件用如下语句 jQuery.data(elem,"events")[type] //老版本也能用 $(elem).data("events")[type] //1.2.3以后才能

jQuery查看dom元素上绑定的事件列表

作为技术狂热分子的职业本能,看到一个技术产品的功能,总会忍不住想知道它是怎么被实现的.比如我每每看到别人网站一个很炫的界面或者很酷的功能,就忍不住打开了浏览器的控制台... 好,不扯远,说说当你想看到网站上某个元素绑定的事件函数的代码时应该怎么做吧. 查看原生绑定的事件函数代码 所谓原生就是通过addEventListener方法绑定到dom元素上.这个好办: 审查绑定事件的元素(对着它右键->审查元素) 在弹出的Elements视图的控制台,右侧点击“Event Listeners”页签 然后

input的focus事件时,鼠标光标在最后

1.如果input框里面没有值,那光标肯定在最后. 2.当input里面有值时,focus事件时,光标会在最前面. 3.想要focus事件时,光标在最后,可以获得焦点后重新把值清空复制粘帖一下 <input type="text" value="input框有值,获取焦点时,鼠标在最后" /> var _val=$("input").val(); $("input").val("").focus

jquery动态添加元素无法触发绑定的事件的解决方案

方法一:绑定live事件(live事件只在jquery1.9以下才支持,高版本不支持). //jquery 1.9(不包括1.9)以下可以 $(".btn").live("click",function(){ alert('这里是动态元素添加的事件'); }) 方法二:利用on()事件绑定 ($(ParentEle).on("click",".thisEle",function(){}) $("body")

JS如何给ul下的所有li绑定点击事件,点击使其弹出下标和内容

这是一个非常常见的面试题,出题方式多样,但考察点相同,下面我们来看看这几种方法:方法一: var itemli = document.getElementsByTagName("li"); for(var i = 0; i<itemli.length; i++){ itemli[i].index = i; //给每个li定义一个属性索引值 itemli[i].onclick = function(){ alert(this.index+this.innerHTML); } } 方

jQuery地图热点效应-后在弹出的提示鼠标层信息

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>地图热点效果-鼠标经过弹出提示信息</title> <meta http-equiv="Content-Type" content=&q

【转发】jQuery给input绑定回车事件

<script type="text/javascript" src="Scripts/jquery-1.6.2.js"></script> <script language="javascript" type="text/javascript"> //方法一如下 $(function(){ $('#dataInput').bind('keypress',function(event){ i

jquery动态添加的元素绑定的事件不生效的问题

我们可以通过 $(document).on('click', '#xxx', callback) 这种形式解决. 原因,一般情况下,我们是通过 $('#xxx').click(callback) 这种形式去绑定,这种绑定之所以生效是因为,我们程序加载 $(function(){}) 的时候绑定了回调,而动态添加上去的,我们并没有去绑定. 所以动态添加的元素,点击的时候并不会触发我们想要的效果.但是实际上,在我们点击的时候,还是产生了点击事件,只是这个事件没有被我们的预期回调处理,因为我们的回调没