追加后jquery事件不起作用

Question

http://jsfiddle.net/YsnhT/2/

追加后，jQuery事件開啟無效。 單擊保存按鈕后，我需要textarea的值。

$('.span8')
    .on('click',
            '.btn',
            function() {
        var input = $("#textarea").val();
        alert(input);
    });

$('body').on('click','#createNote',function() {                $('.span8').empty();
                $('.span8').append('<button type="button" class="btn" style="float: right; margin-right: 8px;background-color:#dddddd;font-family:Roboto Slab;color: black" id="save" data-loading-text="Saving...">Save</button><div class="hero-unit"><input type="text" style="width: 100%" id="title" placeholder="Title"/>'+ 
                '<textarea contenteditable="true" id="textarea" class="textarea" placeholder="Enter text ..."style="width: 100%;">dd</textarea></div>');

            });

HTML：

<div class="span8"></div>

Answer 1

由於#save是動態創建的，因此請使用以下處理程序：

$(document).on('click', '#save' ,function() {
    //do stuff
});

更新的小提琴： http : //jsfiddle.net/tymeJV/YsnhT/3/

您還應該像這樣使“單擊”按鈕處理程序，否則它將不會在新創建的#click按鈕上#click 。

Answer 2

只需以動態格式委派事件：

$(document).on('click', '#save' ,function() {
    //do stuff
})

也許對以下內容也可以這樣做：

$(document).on('click', '#click' ,function() {
    //do stuff
})

Answer 3

保存是在這里動態創建的。因此請嘗試on

$(document).on('click', '#save' ,function() {
});

Answer 4

一旦添加了元素，就需要將處理程序重新綁定到該元素或使用jQuery的live（）函數，如下所示：

$('.span8 .btn').live('click', function() {
    var input = $("#textarea").val();
    alert(input);
});

Answer 5

檢查這個...

$（'。btn'）。click（function（）{

 var input = $("#textarea").val();
    alert(input);

}）;