jquery移除button的inline onclick事件

inline onclick代码如下:

<input type="button" id="btnOK" name="" value="确定" onclick="btnOKClick();" />

btnOKClick的代码:

function btnOKClick() {
            alert("btnOK Clicked");
        }

现在要在点击按钮以后,移除onclick事件,并为按钮绑定一个新的click事件。在第二次点击时候,就开始执行第二个事件处理函数,第二个处理函数的代码:

reclick的代码:

function reclick() {
            alert('reclick');
        }

思路:在btnOKClick中移除onclick,然后添加新的绑定,代码如下:

$('#btnOK').attr('onclick', '').bind('click', function () { reclick(); });

加上这段代码后的btnOKClick方法如下:

function btnOKClick() {
            alert("btnOK Clicked");
            $('#btnOK').attr('onclick', '').bind('click', function () { reclick(); });
        }

这种方法在Google Chrome下正常工作,但是在IE的兼容模式下会马上调用reclick方法,这不是我们想要的效果。

出现这种效果的原因貌似是因为onclick执行完了以后,IE回去查看是否有绑定在click上的handler,结构是有的,于是就马上执行了。

为了解决这个问题,我们可以换个思路,就是延迟绑定click事件。具体的代码如下:

function btnOKClick() {
            alert("btnOK Clicked");
            setTimeout(function () {
                $('#btnOK').attr('onclick', '').bind('click', function () { reclick(); });
            }, 1);
        }

这里使用了setTimeout定时器,在定时器触发以后,才执行移除onclick属性,绑定click handler的代码。

经测试,在IE9的兼容模式和非兼容模式下都可以正常运行;Google Chrome也正常运行。

如果认为此文对您有帮助,别忘了支持一下哦!

作者:齐飞

来源:http://youring2.cnblogs.com/

声明:本博客原创文字只代表本人工作中在某一时间内总结的观点或结论,与本人所在单位没有直接利益关系。非商业,未授权,贴子请以现状保留,转载时必须保留此段声明,且在文章页面明显位置给出原文连接。

转载:http://www.cnblogs.com/youring2/archive/2013/01/25/2876514.html

时间: 2024-11-16 17:54:31

jquery移除button的inline onclick事件的相关文章

jquery移除button的inline onclick事件(已测试及兼容浏览器)_jquery

inline onclick代码如下: 复制代码 代码如下: <input type="button" id="btnOK" name="" value="确定" onclick="btnOKClick();" /> btnOKClick的代码: 复制代码 代码如下: function btnOKClick() { alert("btnOK Clicked"); } 现在要在

jquery移除了live()、die(),新版事件绑定on()、off()的方法_jquery

我蛋疼了快10分钟,怎么调用都是报错,最后一查,原来jquery已经移除了live()和die()方法.使用了新的事件绑定方法on().解除绑定方法off(). 新的绑定方法on()和比live()相比,效率比之前的高.因为live()是固定在document节点上的.如果绑定的元素嵌套在很深的层中,那么事件一级级的传递必将影响到效率.而on()是绑定在$()选择的元素上,嵌套深度可自由选择. on()的参数 on( events [, selector ] [, data ], handler

jQuery移除元素自动解绑事件实现思路及代码_jquery

世界本该如此! 所以,在现代浏览器,如果你将一个元素从DOM树种进行移除的时候,浏览器会自动帮你绑定的事件进行解绑以释放其占用的内存.也许你猜到了,较老版本的浏览器则不会主动去做这件事,所以,当你的应用在较老版本的浏览器运行的越久,其消耗内存越多,应用就会变得越来越卡.因此,需要我们自己对要删除的元素进行事件解绑. 实现思路 用jQuery将元素移除的基本方法常用的有三个,一个是remove()方法,一个是html()方法,一个是empty()方法.我们可以对此三个方法进行进一步的封装,我们会在

js触发asp.net的Button的Onclick事件应用_javascript技巧

在asp.net引入事件驱动之后,在一个页面上很容易解决多个按钮触发不同事件的问题,避免了在asp中需要多个form或者通过js脚本来控制的麻烦. asp.net带来便利的同时,也带来一个问题.在实际应用中一个页面存在多个按钮的情况并不多.用户习惯于在输入框输入内容之后,直接按回车就提交表单了.由于asp.net采用的是事件驱动模式,所以默认用户按回车并没有触发按钮的onclick事件.用户按回车也不是没有提交表单,通过httpwath可以看到,实际上页面表单是提交到了form下的action页

js动态添加的DIV中的onclick事件简单实例_javascript技巧

最简单的是这样: <input type="button" onclick="alert(this.value)" value="我是 button" /> 动态添加onclick事件: <input type="button" value="我是 button" id="bu"> <script type="text/javascript&quo

button不响应后台的onclick事件

问题描述 <%@PageLanguage="C#"AutoEventWireup="true"CodeBehind="Register.aspx.cs"Inherits="tmall.Web.UI.Register"%><!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xht

jquery应该如何来设置改变按钮input的onclick事件_基础知识

jquery应该如何来设置按钮input的onclick事件?比如开始时有个按钮: <input id="prebt" type="button" value="上一页" onclick="ToPage(2)"/>这行代码是在程序后台生成的,和Discuz!NT论坛源码中的做法一样,页面上所有的东西连同脚本都是由后台代码生成..然后用jquery.ajax加载到页面上来..其他的除了ie8不能显示之外..其它浏览器

jquery移除、绑定、触发元素事件使用示例详解

 这篇文章主要介绍了jquery移除.绑定.触发元素事件使用示例详解,需要的朋友可以参考下  代码如下: unbind(type [,data])     //data是要移除的函数 $('#btn').unbind("click"); //移除click $('#btn').unbind(); //移除所有     对于只需要触发一次的,随后就要立即解除绑定的情况,用one()    代码如下: $('#btn').one("click",function(){.

app-SlideMenu和button的onClick事件冲突

问题描述 SlideMenu和button的onClick事件冲突 app主页面有一个左侧滑动菜单,在5.0以上的系统上,当侧滑菜单滑动出来以后,主界面的Button的点击事件失效了 解决方案 textbox的OnTextChanged事件和button的OnClick事件Android开发之button的onClick事件学习 解决方案二: http://www.douban.com/note/151424703/