將jquery事件附加到動態創建的元素（jquery加載php文件）

我有一個php員工目錄網站，它列出了我們在一個表（連接到mysql）中的所有員工，並且您可以單擊每個員工打開他們的詳細信息在另一個分區。將jquery事件附加到動態創建的元素（jquery加載php文件）

$('.emptab').click(function(event) { 
    var status = $(this).attr('id'); 
    $("#empview").load("employee.php", {'data': datastring, 'current': status}); 
});

我本來上面的代碼，但是要能夠將事件附加到動態元素需要，所以我改成下面的代碼：

$('tbody').on('click', 'tr.emptab', function() { 
    var status = $(this).attr('id'); 
    $("#employeedetails").load("employee.php", {'data': datastring, 'current': status}); 
});

我做了這樣的說法，因爲我讀的另一個問題（In jQuery, how to attach events to dynamic html elements?），您可以使用該格式將事件附加到動態元素。只是爲了澄清，這段代碼繼續使用初始頁面，但在使用搜索過濾器後失敗。

我的動態元素來自過濾器/搜索功能，我將根據搜索文本框更改員工列表，該搜索文本框根據我創建的filter.php文檔更改員工列表。

$('#search').on('input propertychange paste', function() { 
    var string = $('#search').val(); 
    $("#employeelist").load("filter.php", {'data': datastring, 'search': string}); 
});

然而，當從PHP文件創建的那些內容，我無法通過我的jquery訪問元素，我不知道我在做什麼錯。還有大約4個其他問題，我看到答案是使用jquery on函數，我嘗試過沒有成功。

謝謝你的時間。

來源

2017-08-29 user163362

您可以使用下面的代碼爲這個

$(document).on('click', '.emptab', function() { 
    var status = $(this).attr('id'); 
    $("#employeedetails").load("employee.php", {'data': datastring, 'current': status}); 
});

來源

2017-08-29 07:29:13

嘿感謝，這工作。只是想知道，爲什麼它必須是文件，而不是像身體或表等東西？ – user163362

它是事件委託，它允許我們將一個事件監聽器附加到一個父元素，該元素將爲匹配選擇器的所有後代觸發，無論這些後代是現在存在還是未來添加。可能是你的tbody元素已經動態創建，這就是爲什麼它的工作原理 –

@ user163362它沒有，任何已經存在的未來元素的祖先元素都會這樣做。 – CBroe

將jquery事件附加到動態創建的元素（jquery加載php文件）

回答

相關問題