jQuery DataTables是一款強大的數據表格插件，能夠讓我們快速創建交互式的數據表格。其中最常用的功能就是彈出框，可以讓我們在表格中修改、刪除以及添加數據。

//創建彈出框
$('#example').on('click', 'tbody td:not(:first-child)', function () {
editor.inline(this, {
submit: 'allIfChanged'
});
});
//編輯
editor = new $.fn.dataTable.Editor({
ajax: "php/edit.php",
table: "#example",
fields: [{
label: "First name:",
name: "firstName"
}, {
label: "Last name:",
name: "lastName"
}, {
label: "Position:",
name: "position"
}, {
label: "Office:",
name: "office"
}, {
label: "Start date:",
name: "startDate",
type: "datetime"
}, {
label: "Salary:",
name: "salary"
}]
});
//刪除
editor = new $.fn.dataTable.Editor({
ajax: "php/delete.php",
table: "#example",
fields: [{
label: "Are you sure you want to delete this row?",
name: "delete",
type: "readonly"
}]
});
//添加
editor = new $.fn.dataTable.Editor({
ajax: "php/add.php",
table: "#example",
fields: [{
label: "First name:",
name: "firstName"
}, {
label: "Last name:",
name: "lastName"
}, {
label: "Position:",
name: "position"
}, {
label: "Office:",
name: "office"
}, {
label: "Start date:",
name: "startDate",
type: "datetime"
}, {
label: "Salary:",
name: "salary"
}]
});

以上就是使用jQuery DataTables實現彈出框的代碼示例，通過這個插件，我們可以方便地管理數據表格中的數據。