JQuery的點擊（）事件觸發兩次時稱爲活（）

Question

http://pastebin.com/1MGTtzij這裏是我的全部HTML文檔，下面是短版：

$(document).ready(function() { 
     $("#myDiv").append($("<input />", { 
          type : "button", 
          id : "myButton1", 
          value : "Click me first!" 
         })); 
     $("#myButton1").live("click", function() { 
      var a = 1; 
      $("#myButton2").click(function() { 
       alert(a); 
      }); 
     }); 
    }); 

的HTML代碼：

<div id="myDiv"></div> 
    <input type="button" id="myButton2" value="Click me!" /> 

頁面停止加載並完全顯示後，您將看到2個按鈕請先點擊我！和Click me！，在我之後：

1. 點擊請點擊我！ - 什麼都沒有發生 - 好吧
2. 點擊點擊我！ - 警報1 - 確定
3. 點擊請點擊我！ - 什麼都沒有發生 - 好吧
4. 點擊點擊我！ - 警報1 - 警報1 ?????????????
   所以我認識到，如果我點擊請先點擊我！ N次，我會得到（N + 1）警報。我該如何解決這個問題？

謝謝大家！

Answer 1

每次在按鈕1上調用點擊處理程序時，都會在按鈕2上添加一個新的點擊處理程序。這就是爲什麼它會增加。

$("#myButton1").live("click", function() { 
    var a = 1; 
    // Don't add a new handler here. Move this outside of the `live` call 
    $("#myButton2").click(function() { 
     alert(a); 
    }); 
}); 

我搬到了variable是由兩個按鈕的點擊處理程序訪問，以及外移動的點擊處理程序設置。看到一個工作example。

Answer 2

每次單擊myButton1時，都會向myButton2添加一個新的.click處理程序。

如果你真的想這樣做，你可以這樣做：$("#myButton2").unbind('click');之前，$("#myButton2").click調用。

Answer 3

這是因爲你每次在click me first!上的click按鈕一個點擊處理程序將被附加到Click me按鈕並且它不斷添加。移動代碼以附加外部的單擊事件處理程序。試試這個

$(document).ready(function() { 
     $("#myDiv").append($("<input />", { 
          type : "button", 
          id : "myButton1", 
          value : "Click me first!" 
         })); 
     $("#myButton1").live("click", function() { 
      var a = 1; 

     }); 
     $("#myButton2").click(function() { 
       alert(a); 
     }); 
    });