jquery移除button的inline onclick事件(已測(cè)試及兼容瀏覽器)
inline onclick代碼如下:
<input type="button" id="btnOK" name="" value="確定" onclick="btnOKClick();" />
btnOKClick的代碼:
function btnOKClick() {
alert("btnOK Clicked");
}
現(xiàn)在要在點(diǎn)擊按鈕以后,移除onclick事件,并為按鈕綁定一個(gè)新的click事件。在第二次點(diǎn)擊時(shí)候,就開始執(zhí)行第二個(gè)事件處理函數(shù),第二個(gè)處理函數(shù)的代碼:
reclick的代碼:
function reclick() {
alert('reclick');
}
[\s\S ]*\n
思路:在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的兼容模式下會(huì)馬上調(diào)用reclick方法,這不是我們想要的效果。
出現(xiàn)這種效果的原因貌似是因?yàn)閛nclick執(zhí)行完了以后,IE回去查看是否有綁定在click上的handler,結(jié)構(gòu)是有的,于是就馬上執(zhí)行了。
為了解決這個(gè)問題,我們可以換個(gè)思路,就是延遲綁定click事件。具體的代碼如下:
function btnOKClick() {
alert("btnOK Clicked");
setTimeout(function () {
$('#btnOK').attr('onclick', '').bind('click', function () { reclick(); });
}, 1);
}
這里使用了setTimeout定時(shí)器,在定時(shí)器觸發(fā)以后,才執(zhí)行移除onclick屬性,綁定click handler的代碼。
經(jīng)測(cè)試,在IE9的兼容模式和非兼容模式下都可以正常運(yùn)行;Google Chrome也正常運(yùn)行。
- jquery動(dòng)態(tài)改變onclick屬性導(dǎo)致失效的問題解決方法
- 使用jQuery的attr方法來修改onclick值
- jquery應(yīng)該如何來設(shè)置改變按鈕input的onclick事件
- jquery單選框radio綁定click事件實(shí)現(xiàn)方法
- JQuery調(diào)用綁定click事件的3種寫法
- jQuery中click事件的定義和用法
- Jquery為DIV添加click事件的簡單實(shí)例
- jQuery取消特定的click事件
- jQuery綁定事件方法及區(qū)別(bind,click,on,live,one)
- jQuery動(dòng)態(tài)移除與增加onclick屬性的方法詳解
相關(guān)文章
jQuery解析json數(shù)據(jù)實(shí)例分析
這篇文章主要介紹了jQuery解析json數(shù)據(jù)的具體實(shí)現(xiàn)方法,結(jié)合實(shí)例形式較為詳細(xì)的分析了jQuery解析json格式數(shù)據(jù)的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-11-11
使用Jquery獲取帶特殊符號(hào)的ID 標(biāo)簽的方法
這篇文章主要介紹了使用Jquery如何獲取帶特殊符號(hào)的ID 標(biāo)簽,該怎么寫,需要的朋友可以參考下2014-04-04
Jquery Ajax學(xué)習(xí)實(shí)例 向頁面發(fā)出請(qǐng)求,返回XML格式數(shù)據(jù)
Jquery Ajax學(xué)習(xí)實(shí)例 向頁面發(fā)出請(qǐng)求,返回XML格式數(shù)據(jù)的代碼2010-03-03
jQuery+css實(shí)現(xiàn)的切換圖片功能代碼
這篇文章主要介紹了jQuery+css實(shí)現(xiàn)的切換圖片功能代碼,涉及jQuery響應(yīng)鼠標(biāo)事件動(dòng)態(tài)變換頁面元素樣式的相關(guān)技巧,需要的朋友可以參考下2016-01-01
Jquery ajax執(zhí)行順序 返回自定義錯(cuò)誤信息(實(shí)例講解)
由于Jquery中的Ajax的async默認(rèn)是true(異步請(qǐng)求),如果想一個(gè)Ajax執(zhí)行完后再執(zhí)行另一個(gè)Ajax, 需要把a(bǔ)sync=false就可以了2013-11-11
基于jQuery實(shí)現(xiàn)選取月份插件附源碼下載
這是一個(gè)基于jQuery的可以選擇年份和月份的月份拾取插件,你可以設(shè)置點(diǎn)擊頁面上的任意元素觸發(fā)彈出年月選擇面板,可以是一個(gè)鏈接也可以是一個(gè)輸入框,廣泛應(yīng)用于月份查詢,而無需設(shè)置select表單。2015-12-12
jQuery插件HighCharts繪制2D餅圖效果示例【附demo源碼下載】
這篇文章主要介紹了jQuery插件HighCharts繪制2D餅圖效果,結(jié)合完整實(shí)例形式分析了jQuery使用HighCharts插件繪制餅圖效果的操作步驟與相關(guān)實(shí)現(xiàn)技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2017-03-03
JavaScript實(shí)現(xiàn)的彈出遮罩層特效經(jīng)典示例【基于jQuery】
這篇文章主要介紹了JavaScript實(shí)現(xiàn)的彈出遮罩層特效,結(jié)合實(shí)例形式分析了基于jQuery實(shí)現(xiàn)的頁面元素與屬性動(dòng)態(tài)操作相關(guān)使用技巧,需要的朋友可以參考下2019-07-07

