所以我創建了一個 JQuery 對話框并使用 ajax 獲取它的內容（表）。該表包括資料庫中的所有列，并且我在每一行中添加了一個按鈕，該按鈕具有對應的 id（來自資料庫），單擊它會顯示完整的詳細資訊。問題是，表格每一行上的按鈕根本沒有回應，即使是一個簡單的 js 警報，它也沒有顯示任何內容。
$(".view-table-btn").on( "click", function() {
var group_id = $(this).attr('data-group_id');
$.ajax({
type: "POST",
data:{
search:"table",
group_id:group_id,
},
url: "./function/view_group-table.php",
success: function (table_data) {
$("#group-attr_table").dialog( "open" );
$('#group-attr_table').empty();
$('#group-attr_table').append(table_data);
}
});
});
$( "#group-attr_table" ).dialog({
autoOpen: false,
resizable: false,
width:800,
height:600,
modal: true,
draggable: false,
show: {
effect: "fold",
duration: 500
},
hide: {
effect: "slide",
duration: 500
},
});
// Here is the code for the button onclick on the ajax table inside of a dialog
$(".user_details").on( "click", function() {
var id = $(this).html();
alert(this);
console.log(id);
});
更新 它已經修復了，感謝@dubafek！如果計劃用它添加 dataTables 只需用它更改它
$("#datatable_id").on("click", ".btn-class", function()
//Your code goes here
});
uj5u.com熱心網友回復：
我不確定table_data包含什么，但我假設它們是具有 class 屬性的物件.user_details。在這種情況下，由于 AJAX 呼叫是異步的，因此您在 DOM 中存在物件之前分配了單擊行為。我建議您在填寫表格時分配點擊事件觸發器：
$(".view-table-btn").on( "click", function() {
var group_id = $(this).attr('data-group_id');
$.ajax({
type: "POST",
data:{
search:"table",
group_id:group_id,
},
url: "./function/view_group-table.php",
success: function (table_data) {
$("#group-attr_table").dialog( "open" );
$('#group-attr_table').empty();
$('#group-attr_table').append(table_data);
$(".user_details").on( "click", function() {
var id = $(this).html();
alert(this);
console.log(id);
});
}
});
});
$( "#group-attr_table" ).dialog({
autoOpen: false,
resizable: false,
width:800,
height:600,
modal: true,
draggable: false,
show: {
effect: "fold",
duration: 500
},
hide: {
effect: "slide",
duration: 500
},
});
希望能幫助到你
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/511222.html