深入理解JQuery循環(huán)綁定事件
來源:易賢網(wǎng) 閱讀:885 次 日期:2016-06-17 11:30:46
溫馨提示:易賢網(wǎng)小編為您整理了“深入理解JQuery循環(huán)綁定事件”,方便廣大網(wǎng)友查閱!

下面小編就為大家?guī)硪黄钊肜斫釰Query循環(huán)綁定事件。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。

深入理解JQuery循環(huán)綁定事件

<html>

  <head>

    <title></title>

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

  </head>

  <body>

    <script type="text/javascript">

      $(document).ready(function () {

        var array = [0, 1, 2, 3];

        // 1.

         

        // 始終彈出3, 因為function() {} 并沒有被立即解析,直到調用的時候才被解析,這時index已經(jīng)是3了。

        // 2.

         

        // 立即彈出0, 1, 2, 3,因為使用了function() {}(index)立即被解析,遇到alert,就立即彈出來了。

        // 3.

         

        // 正確執(zhí)行,點擊btn0,彈出0,點擊btn1,彈出1...

        // 1.因為function(i) {}(index)是被立即解析的,所以i依次送入的是0, 1, 2, 3

        // 2.內部沒有直接alert,是因為不想立即執(zhí)行,想點擊時再執(zhí)行,所以返回了一個函數(shù)出去。

        // 4.

        for (var index in array) {

          $("#btn" + index).bind("click", {index: index}, clickHandler);

        }

        function clickHandler(event) {

          var index = event.data.index;

          var item = array[index];

          alert(item);

        }

        // 正確執(zhí)行,點擊btn0,彈出0,點擊btn1,彈出1...

        // 利用了event.data,因為index在綁定的時候已經(jīng)被持久化到event.data中了,所以響應的時候我們可以取到。

      });

     

    </script>

    <input type="button" id="btn0" value="btn0" />

    <input type="button" id="btn1" value="btn1" />

    <input type="button" id="btn2" value="btn2" />

    <input type="button" id="btn3" value="btn3" />    

  </body>

</html>

以上這篇深入理解JQuery循環(huán)綁定事件就是小編分享給大家的全部內容了,希望能給大家一個參考

更多信息請查看網(wǎng)絡編程
易賢網(wǎng)手機網(wǎng)站地址:深入理解JQuery循環(huán)綁定事件

2025國考·省考課程試聽報名

  • 報班類型
  • 姓名
  • 手機號
  • 驗證碼
關于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡要咨詢 | 簡要咨詢須知 | 新媒體/短視頻平臺 | 手機站點 | 投訴建議
工業(yè)和信息化部備案號:滇ICP備2023014141號-1 云南省教育廳備案號:云教ICP備0901021 滇公網(wǎng)安備53010202001879號 人力資源服務許可證:(云)人服證字(2023)第0102001523號
聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關注公眾號:hfpxwx
咨詢QQ:1093837350(9:00—18:00)版權所有:易賢網(wǎng)