Question

我正在创建一个表，它从MySQL获取一些数据并显示它们。使用Ajax添加和附加用户添加信息和数据。

问题是表格的每一行都包含一个删除按钮。当附加一个新行时，我终于能够附加一个按钮。

但是在刷新页面之前，此按钮不会执行任何操作。如果我们采取Facebook。添加新状态或照片时，它们是多个按钮，其中包含附加的操作。那么如何附加一个带有动作的按钮。

所以在我的表中，每个删除按钮都应该使用行id来删除它。这是一些脚本：

使用新行附加按钮：

var btn = '<button type="Button" id="delete">Delete</button>';

$("#before_tr").before("<tr><td>"+name+"</td><td>"+address+"</td><td>"+phone+"</td><td>"+btn+"</td></tr>");

Answer 1

您可以使用Javascript。

var btn = '<button onClick="return confirm('Delete $id ?') type="Button" id="delete">Delete</button>';

Answer 2

正在动态创建元素。

您需要使用Event Delegation。您必须使用委托事件方法来使用.on()。

委托事件的优势在于它们可以处理来自稍后添加到文档的后代元素的事件。

一般语法

$(staticParentElement).on('event','selector',callback_function)

添加一个类，因为HTML中的标识符必须是唯一的

var btn = '<button type="Button" class="delete">Delete</button>';

实施例

$(document).on('click', ".delete", function(){
    //code to remove row
    $(this).closest('tr').remove();
});

注意：代替document，您应该使用最接近的静态容器。

附加一个带有动作和属性的按钮

2 个答案: