另一個按鈕的onclick事件後產生的按鈕上的Javascript函數

Question

我有一個腳本，用戶可以按下一個按鈕，使得AJAX調用。一旦通話完成，按鈕將被替換爲文字「完成」以及稱爲「撤消」的新按鈕。目的是允許用戶取消他們只是採取了行動：但是，我無法作出撤銷按鈕連接到該ID的onclick功能

<script type="text/javascript"> 
$('button').on('click', function() { 
     ajax call 
     }); 
update.append('Complete<button type=\"button\" id=\"undo\">Undo</button>'); 
     $(this).remove(); 
    }); 
    </script> 

。實際上，當我單擊撤消按鈕時，似乎沒有任何事情發生。我相信它可能與上面的onclick函數的update.append中生成的撤消按鈕有關。但是，我無法理解將要發生的事情錯誤。這裏是我的id爲撤銷按鈕撤銷點擊事件功能（這是在原有的onclick功能加入以上）：

$("#undo").click(function() { 
     ajax call 
    }); 

我把這個功能僅低於我的劇本的第一個功能，但沒有當我按下撤消按鈕時會發生。即使我在測試功能中添加警報，警報也不會顯示。

任何建議將不勝感激。

Answer 1

$("#undo").click只有在元素未被動態添加到DOM時纔有效。既然你是動態添加undo使用.on代替：

$('body').on('click', '#undo', function() { 
    ajax call 
}); 

Answer 2

我猜斯賓塞答案將無法正常工作。 曲子事件應附於現有的元素在DOM 修改自己的代碼類似下面應該工作

$("body").on('click', '#undo', function() { 
    ajax call 
}); 

Answer 3

簡單的點擊綁定將無法工作。您必須使用以下內容。

$("body").on('click', '#undo', function() { 
    ajax call 
}); 

或

$(document).on('click', '#undo', function() { 
    ajax call 
});