DOM創建後不工作的Jquery動作事件

我創建了一個DOM後創建的按鈕。該按鈕有一個動作。我遇到的麻煩是將該操作綁定到按鈕。我已經研究過，人們對我們說.on（）函數，但它似乎沒有工作。我錯過了什麼？DOM創建後不工作的Jquery動作事件

HTML

<button id="firstClick">Click me to create another button</button> 
<div id="container"></div>

的Javascript

$('#firstClick').click(function() { 
    $('#container').append('<button class="second-button">Button after DOM</button>'); 
}); 

$('.second-button').on('click', function() { 
    alert("Success"); 
})

來源

2014-07-11 cYn

工作DEMOL http://jsfiddle.net/Metsx/或http://jsfiddle.net/ZB2Ns/

API：.onhttp://api.jquery.com/on/

我們讓您的活動了解你在document或#container水平需要.on點擊事件，將事件處理器的當前選擇集jQuery對象中的元素。

休息應該適合你的需要:)

代碼

$('#firstClick').click(function() { 
    $('#container').append('<button class="second-button">Button after DOM</button>'); 
}); 

$(document).on('click', '.second-button', function() { 
    alert("Success"); 
})

來源

2014-07-11 03:13:02

美麗！謝謝。我非常欣賞這兩個不同的例子。 – cYn

@cYn很高興幫助你'：）' –

你需要告訴DOM，父母聽其子。

問題是您的新.second-button是一個新元素，並且您已經在DOM實際存在之前定義了您的.click函數。

但是所有的DOM互動會觸發一個事件的傳播（冒泡），因此你可以告訴#container的監聽來自。第二個按鈕

未來點擊的事件或使用$（文件）。在聽，因爲冒泡將一路走向文檔根源。

如果您的表現最低限度超過您只會執行#container .on，並停止傳播，因爲它們不需要前往每個父節點，但最終可能需要從父代中聽取它#container，誰知道

來源

2014-07-11 03:30:58 devric

真正洞察這個功能如何工作。我實際上有一個更深入的DOM元素追加和@ Tats_innit的解決方案沒有工作一分鐘。通過你的解釋，我能夠告訴DOM中已經存在的元素來監聽click事件，並向下移動元素以觸發特定的元素。我現在完全忍不住了。謝謝。 – cYn

DOM創建後不工作的Jquery動作事件

回答

相關問題