Question

我正在尝试制作待办事项列表类型的东西。在这里，我希望将新目标保存到数据库中，然后仅将具有相关列表的div刷新，显示添加了新目标的列表。

数据库更新正常，带有新列表项的新html返回正常，但是 .replaceWith（）似乎不起作用。没有任何事情发生。

它在该功能之外工作，但不在其中，我不知道为什么。

$('.addGoal').submit(function(event){
    var listid = $(this).attr('id');
    var desc = $(this).children('.goalinput').val();

    event.preventDefault();

    if(desc == "") {
        console.log("empty!");
        return;
    }

    var posting = $.post("updatedata.php", { what :'addgoal', id: listid, data: desc});
    posting.done(function(data){
            console.log("saved!" + data); //this works, the updated html is being returned
            $(this).closest('#goallist').replaceWith("Returned data goes here"); //this works outside of this function but not inside of it. 
        });
    });

Answer 1

this不会自动将其值保留在回调函数中。您需要绑定一个闭包变量：

$('.addGoal').submit(function(event){
    var listid = $(this).attr('id');
    var desc = $(this).children('.goalinput').val();

    event.preventDefault();

    if(desc == "") {
        console.log("empty!");
        return;
    }

    var that = this; // Closure variable
    var posting = $.post("updatedata.php", { what :'addgoal', id: listid, data: desc});
    posting.done(function(data){
        console.log("saved!" + data);
        $(that).closest('#goallist').replaceWith("Returned data goes here");
    });
});

Answer 2

请参阅

How to access the correct this / context inside a callback?有关一般问题的解释和解决方案，
$(this) inside of AJAX success not working针对$.ajax

但是，因为无论如何ID都应该在HTML文档中是唯一的，您可以将$(this).closest('#goallist')替换为$('#goallist')并完全忽略this。

jquery replaceWith（）无法在$ .post函数中工作

2 个答案: