Jquery on綁定的事件 觸發(fā)多次實(shí)例代碼
用‘on'函數(shù)為一個(gè)新增的按鈕綁定了一個(gè)事件,這是事件會(huì)觸發(fā)多次。
<html> <head> <meta name="viewport" content="width=device-width" /> <title>碼上飄</title> <script src="/FrontStyle/js/jquery-1.11.2.min.js" type="text/javascript"></script> <script> $(function(){ $('#btn1').click(function () { $('#btnBind').on('click',function () { alert(123); }); }); }) </script> </head> <body> <input id="btn1" type="button" value="確認(rèn)" /> <input id="btnBind" type="button" value="綁定按鈕" /> </body> </html>
如上面的代碼,如果你點(diǎn)擊多次'btn1'按鈕,那么就會(huì)綁定多少次click事件到'btnBind'按鈕上,on是綁定多少次就觸發(fā)多少次的。
解決方案:
1.要想它只綁定一次,可以先'off'解綁然后再'on'。
$('#btnBind').off('click').on('click',function () { alert(123); });
2.執(zhí)行一次后解綁unbind()
$('#btn1').click(function () { $('#btnBind').on('click',function () { alert(123); });<BR> $("#btnBind").unbind("click") });
以上這篇Jquery on綁定的事件 觸發(fā)多次實(shí)例代碼就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
- jQuery的事件預(yù)綁定
- 淺談jQuery中Ajax事件beforesend及各參數(shù)含義
- 淺談jQuery hover(over, out)事件函數(shù)
- 利用JQuery阻止事件冒泡
- jQuery-mobile事件監(jiān)聽(tīng)與用法詳解
- 基于jQuery的select下拉框選擇觸發(fā)事件實(shí)例分析
- jQuery實(shí)現(xiàn)自動(dòng)調(diào)用和觸發(fā)某個(gè)事件的方法
- jQuery 移動(dòng)端拖拽(模塊化開(kāi)發(fā),觸摸事件,webpack)
- 淺談jquery之on()綁定事件和off()解除綁定事件
- 淺談jQuery綁定事件會(huì)疊加的解決方法和心得總結(jié)
- 詳解jQuery中的事件
相關(guān)文章
jQuery實(shí)現(xiàn)的點(diǎn)擊圖片居中放大縮小功能示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的點(diǎn)擊圖片居中放大縮小功能,涉及jQuery基于事件響應(yīng)針對(duì)頁(yè)面元素動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2019-01-01jquery入門(mén)—編寫(xiě)一個(gè)導(dǎo)航條(可伸縮)
編寫(xiě)一個(gè)導(dǎo)航條,單擊標(biāo)題時(shí),可以伸縮導(dǎo)航條內(nèi)容,簡(jiǎn)化內(nèi)容或顯示更多內(nèi)容等等效果相當(dāng)不錯(cuò),感興趣的朋友可以了解下哦2013-01-01Jquery寫(xiě)一個(gè)鼠標(biāo)拖動(dòng)效果實(shí)現(xiàn)原理與代碼
近日項(xiàng)目中要做一個(gè)鼠標(biāo)拖拽層的效果,于是手動(dòng)使用Jquery做了一個(gè),發(fā)出來(lái)跟大伙兒分享一下,并希望能得到高手的指點(diǎn),如何有高手改進(jìn)的話,在下不勝感激2012-12-12jQuery+ajax實(shí)現(xiàn)無(wú)刷新級(jí)聯(lián)菜單示例
這篇文章主要介紹了jQuery+ajax實(shí)現(xiàn)無(wú)刷新級(jí)聯(lián)菜單示例,代碼很完整,也非常實(shí)用,有需要的小伙伴可以參考下。2015-05-05html、css和jquery相結(jié)合實(shí)現(xiàn)簡(jiǎn)單的進(jìn)度條效果實(shí)例代碼
這篇文章主要介紹了html、css和jquery相結(jié)合實(shí)現(xiàn)簡(jiǎn)單的進(jìn)度條效果的實(shí)例代碼,這個(gè)進(jìn)度條特別簡(jiǎn)單,首先html里面的話就是一個(gè)div里面嵌套一個(gè)div,然后寫(xiě)好想要的樣式就行了,具有一定的參考借鑒價(jià)值,感興趣的朋友一起看看吧2016-10-10