0

我有一个用户表，我有一个从数据库中删除用户的链接。有时它工作正常，但有时当我确认删除时它会冻结，我必须按“Esc”按钮才能使确认窗口消失。我使用 "$(document).on('click', function()" 因为我通过 jquery 添加用户，如果我使用 "$(document).ready(function()" 新添加的用户不会删除。可以请检查此脚本是否有错误并告诉我是脚本问题还是其他问题？可能有改进的方法吗？

脚本

$(document).on('click', function() {
        $("a:contains('Delete')").click(function(event) {
            if(confirm("Are you sure ?")){
                $.ajax({
                    url: $(event.target).attr("href"),
                    type: "DELETE",

                    beforeSend: function(xhr) {
                        xhr.setRequestHeader("Accept", "application/json");
                        xhr.setRequestHeader("Content-Type", "application/json");
                    },

                    success: function() {
                        var tr = $(event.target).closest("tr");
                        tr.css("background-color","#000000");
                        tr.fadeIn(1000).fadeOut(200, function(){
                        tr.remove();})
                    }
                });
            } else {
                event.preventDefault();
            }
            event.preventDefault();
        });
    });

带有删除链接的表格单元格

<a href="/delete/${user.login}.json">Delete</a>

更新：我已经这样改变了

脚本

function Delete(event){
            if(confirm("Are you sure ?")){
                $.ajax({
                    url: $(event.target).attr("href"),
                    type: "GET",

                    beforeSend: function(xhr) {
                        xhr.setRequestHeader("Accept", "application/json");
                        xhr.setRequestHeader("Content-Type", "application/json");
                    },

                    success: function() {
                        var tr = $(event.target).closest("tr");
                        tr.css("background-color","#000000");
                        tr.fadeIn(1000).fadeOut(200, function(){
                        tr.remove();})
                    }
                });
            } else {
                event.preventDefault();
            }
            event.preventDefault();
        };

关联

<a href="/delete/${user.login}.json" onclick="Delete()">Delete</a>

但是现在我卡在一个空白页面上，其中包含我的值的 url href，但是用户被删除了。

4

2 回答 2

0

每次单击链接时都会触发 $(document).on('click'。因此，每次单击链接时，都会再次添加单击绑定。添加新元素后，它们也应该获得绑定。解决以另一种方式。另请参阅：测试事件处理程序是否绑定到 jQuery 中的元素

于 2013-08-22T09:51:20.897 回答
0

将您的脚本更改为：

function Delete(url,ele){
            if(confirm("Are you sure ?")){
                $.ajax({
                    url: url,
                    type: "GET",

                    beforeSend: function(xhr) {
                        xhr.setRequestHeader("Accept", "application/json");
                        xhr.setRequestHeader("Content-Type", "application/json");
                    },

                    success: function() {
                        var tr = $(ele).closest("tr");
                        tr.css("background-color","#000000");
                        tr.fadeIn(1000).fadeOut(200, function(){
                        tr.remove();})
                    }
                });
            } else {
                return false;
            }
            //event.preventDefault(); no need for this
        };

以及您的链接：

<a href="javascript:void(0)" onclick="Delete('/delete/${user.login}.json',this)">Delete</a>

于 2013-08-22T09:51:32.483 回答