jquery replaceWith（）不工作在$ .post函數

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

請參閱

• 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。

Answer 2

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"); 
    }); 
});