快捷導(dǎo)航

Jquery on綁定的事件觸發(fā)多次實(shí)例代碼

更新時(shí)間：2016年12月08日 09:52:40 投稿：jingxian

下面小編就為大家?guī)硪黄狫query on綁定的事件觸發(fā)多次實(shí)例代碼。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧

用‘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í)例代碼就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

jquery trigger實(shí)現(xiàn)聯(lián)動(dòng)的方法
這篇文章主要介紹了jquery trigger實(shí)現(xiàn)聯(lián)動(dòng)的方法,結(jié)合實(shí)例形式分析了trigger的具體使用技巧,需要的朋友可以參考下
2016-02-02
jquery實(shí)現(xiàn)div陰影效果示例代碼
div陰影效果在以前都是采用圖片來實(shí)現(xiàn)的，而在本文大家將學(xué)會(huì)使用jquery來實(shí)現(xiàn)，感興趣的朋友可以參考下
2013-09-09
JQuery 將元素顯示在屏幕的中央的代碼
在網(wǎng)站開發(fā)中我們經(jīng)常需要將對話框顯示在屏幕的中央。如果使用Javascript因?yàn)闉g覽器實(shí)現(xiàn)的差異，實(shí)現(xiàn)起來非常麻煩。但是JQuery可以很簡單實(shí)現(xiàn)的搞定這一切。
2010-02-02
10款新鮮出爐的 jQuery 插件(Ajax 插件，有幻燈片、圖片畫廊、菜單等)
這篇文章與大家分享的是10款新鮮出爐的基于 jQuery 開發(fā)的 Ajax 插件，有幻燈片、圖片畫廊、菜單等很多有用的插件。這些作者的想法特別新穎，希望你能從中找到自己需要的插件。
2011-06-06
jQuery插件ajaxFileUpload使用實(shí)例解析
這篇文章主要為大家詳細(xì)介紹了jQuery插件ajaxFileUpload使用實(shí)例,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-10-10
Jquery $when done then的用法詳解
這篇文章主要介紹了Jquery $when done then的用法詳解的相關(guān)資料,本文還通過一個(gè)例子給大家介紹jquery when then(done) 用法，需要的朋友可以參考下
2016-05-05
jQuery.query.js 取參數(shù)的兩點(diǎn)問題分析
最近在項(xiàng)目中使用jQuery.query.js這個(gè)插件進(jìn)行頁面間URL傳值，遇到如下兩點(diǎn)問題
2012-08-08
使用easyui從servlet傳遞json數(shù)據(jù)到前端頁面的兩種方法
這篇文章主要介紹了用easyui從servlet傳遞json數(shù)據(jù)到前端頁面的兩種方法，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值,需要的朋友可以參考下
2019-09-09
jQuery回車實(shí)現(xiàn)登錄簡單實(shí)現(xiàn)
實(shí)現(xiàn)登錄的方法有很多，這里為大家介紹下實(shí)現(xiàn)回車提交表單，具體如下，感興趣的朋友可以參考下
2013-08-08
jQuery的緩存機(jī)制淺析
這篇文章主要介紹了jQuery的緩存機(jī)制淺析,并且模擬jQuery自己寫了一個(gè)簡單的緩存系統(tǒng)實(shí)例,需要的朋友可以參考下
2014-06-06