Javascript 删除删除的行后，不进行动态行删除

数据来自后端，每行都有一个删除按钮，用于从数据库中删除行数据。

已成功删除数据，但未删除该行

我在这里试过各种各样的问题，试过各种可能的解决办法，但都不管用

function myFunction(id){
    var url = "http://localhost:8080/CurdAppBackend/emp/delete/"+ id;

    $.ajax({
        type : "DELETE",
        url : url,
        success: function (result) {       
               alert("DELETED");
               f$('.table tbody').closest(id).remove();
        },
        error: function (e) {
            alert(JSON.stringify(e));
        }
    });
};

这就是加载表数据的方式

$（文档）.ready（函数（）{
变量url=”http://localhost:8080/CurdAppBackend/emp/allEmp";
美元({
url:url，
数据类型：“json”，
contentType:“应用程序/json”，
成功：功能（数据）{
var users=JSON.parse（JSON.stringify（data））；
for（用户中的var i）{
$（“tbody”）。
附加（”\
“+用户[i].empId+”\
“+用户[i]。创建数据+”\
“+用户[i].empName+”\
“+用户[i]。empMobile+”\
“+用户[i]。empDesg+”\
“+用户[i]。单位+”\
“+‘删除’+”\
");              
}                   
},
错误：函数（e）{
警惕（“出了问题”+e）；
}
});

使用：

$（'#'+id）.remove（）；

---

而不是：

f$（'.table tbody'）.closest（id）.remove（）；

有很多方法可以做到这一点：

以下给出了2种方法：

第一种方法：

function myFunction(id, obj){
    var url = "http://localhost:8080/CurdAppBackend/emp/delete/"+ id;

    $.ajax({
        type : "DELETE",
        url : url,
        success: function (result) {       
               $(obj).parents('tr').remove();
        },
        error: function (e) {
            alert(JSON.stringify(e));
        }
    });
};

将您的代码更改为：因为在模板中使用方法是最好的，因为您不会忘记任何quot并且易于实现，等等

$(document).ready(function(){
    var url = "http://localhost:8080/CurdAppBackend/emp/allEmp";

    $.get({
        url: url,
        datatype: "json",
        contentType: "application/json",
        success: function(data){
            var users = JSON.parse(JSON.stringify(data));

            for (var i in users) {
                $("tbody").
                append(`<tr id="${users[i].empId}">
                            <td>${users[i].empId}</td>
                            <td>${users[i].createdAt}</td>
                            <td>${users[i].empName}</td>
                            <td>${users[i].empMobile}</td>
                            <td>${users[i].empDesg}</td>
                            <td>${users[i].unit}</td>
                            <td><button onclick="myFunction(${users[i].empId}, this)" class="btn btn-outline-danger" id=del>DELETE</button></td>
                            </tr>`);              
            }                   


        },
        error: function(e){
            alert("Something Went Wrong  "+e);
        }
    });

到

我很高兴找到它，因为在一些通过ajax动态加载数据的情况下，找不到它。

---

然后我们必须在dom中找到那个对象，

你的

函数2

正在创建一个事件绑定。它没有删除我之前尝试过的任何东西，但它也不起作用。检查编辑过的答案什么是

id

？和

closest（）

通过祖先，而不是通过孩子。我也尝试过

$（“\id”）.remove（）

这也不起作用

id

即我已向每行提供了emp id

$(document).ready(function(){
    var url = "http://localhost:8080/CurdAppBackend/emp/allEmp";

    $.get({
        url: url,
        datatype: "json",
        contentType: "application/json",
        success: function(data){
            var users = JSON.parse(JSON.stringify(data));

            for (var i in users) {
                $("tbody").
                append(`<tr id="${users[i].empId}">
                            <td>${users[i].empId}</td>
                            <td>${users[i].createdAt}</td>
                            <td>${users[i].empName}</td>
                            <td>${users[i].empMobile}</td>
                            <td>${users[i].empDesg}</td>
                            <td>${users[i].unit}</td>
                            <td><button onclick="myFunction(${users[i].empId}, this)" class="btn btn-outline-danger" id=del>DELETE</button></td>
                            </tr>`);              
            }                   


        },
        error: function(e){
            alert("Something Went Wrong  "+e);
        }
    });

f$('.table tbody').closest(id).remove();

$('table').find(`id="${id}"`).remove();