jquery追加樣式和函數

我追加一些ID的按鈕，我用這些ID做點擊的東西當它追加沒有采取按鈕（）效果並點擊它不採取的功能，我創建它的這個按鈕的IDjquery追加樣式和函數

$("button#edit-doc").each(function() { 
    $(this).button(); 
    $(this).on("click", function(){ 
     alert("clicked"); 
    }); 
});

追加按鈕

$("#append").on("click", function(){ 
    $('div#container').append("<button id='edit-doc'> Edit </button>"); 
});

容器

<div id="container"></div>

來源

2013-07-10 Ahmed Miro

'$（「＃鍵編輯文檔」）each' - 你有相同ID的多個元素。？你不應該使用類來代替。 – bfavaretto

這似乎是你追求的：

function handler() { alert('clicked'); } 

$("#append").on("click", appendButton); 

function appendButton(){ 
    $('#container').append(function() { 
     return $("<button id='edit-doc'> Edit </button>").on("click", handler); 
    }) 
}

http://jsfiddle.net/PF8xY/

關於此問題的更多信息，請參閱jQuery how to bind onclick event to dynamically added HTML element。

來源

2013-07-10 19:35:07 Sparko

$(document).on("click", "#selector", function(){ 
    //Your code here. 
});

使用文檔，以供selector與.on將允許你綁定事件動態創建的元素。這是我發現在執行之前DOM元素不存在的唯一方法。

我在動態創建的表中進行分類並且效果很好。

編輯：

這裏是一個例子。點擊該按鈕添加div，然後點擊div以獲取其內容。

http://jsfiddle.net/FEzcC/1/

來源

2013-07-10 19:39:15 defaultNINJA

第一個代碼塊附加一個事件監聽與類=「編輯文檔」所有的按鈕，使用類，而不是因爲一個id的名字一個ID只能每頁出現一次。所以我說，當你的瀏覽器到達這個代碼時，事件列表程序將被添加到文檔中所有可用的按鈕上。它不會將事件列表添加到您將在稍後單擊某個元素時添加的按鈕，因爲它不知道。您將不得不再次爲您追加的按鈕重新執行代碼。但你不想要的是添加一個新的事件列表到原始按鈕，導致兩個事件被調用。

喜歡的東西：

// Load all buttons with class=edit-doc and add event listner 
$(function() { 
    $("button.edit-doc").button().on("click", function(){ 
     alert("clicked"); 
    }); 
}); 

// Append button if button with id=append is clicked 
$("#append").on("click", function(){ 
    var button = $.parseHTML("<button class='edit-doc'>Edit</button>"); 
    $('div#container').append(button); 
    $(button).button().on("click", function(){ 
     alert("clicked"); 
    }); 
});

工作例如：

http://jsfiddle.net/RC9Vg/

來源

2013-07-10 19:56:24 sam

jquery追加樣式和函數

回答

相關問題