我想用class dialogBody清空div的内容,然后附加返回的ajax响应。请参阅下面的代码。我遇到的问题是.html(响应)没有做任何事情,因为已删除clicked元素。如何在删除单击元素后继承$ this.closest('。dialogBody')的目标元素?
<div class="dialogBody">
<p>Some content<a href="/question/33" class="ajaxReplace">Click to show question</a></p>
</div>
<script>
$(".ajaxReplace").live("click", function(e){
e.preventDefault();
var $this = $(this);
$this.closest('.dialogBody').empty();
ajaxUrl = $(this).attr("href")+"?ajax=1";
$.ajax({
type: "POST",
url: ajaxUrl,
success: function(response){
$this.closest('.dialogBody').html(response);
console.log(response);
}
})
});
</script>
答案 0 :(得分:4)
将其分配给变量:
$(".ajaxReplace").live("click", function(e){
e.preventDefault();
var $this = $(this);
var $dBody = $this.closest('.dialogBody').empty(); // <------
ajaxUrl = $(this).attr("href")+"?ajax=1";
$.ajax({
type: "POST",
url: ajaxUrl,
success: function(response){
$dBody.html(response); // <------
console.log(response);
}
})
});
答案 1 :(得分:2)
保存对所需元素的引用,而不是保存对将要删除的元素的引用:
$(".ajaxReplace").live("click", function(e){
e.preventDefault();
var ajaxUrl = $(this).attr("href")+"?ajax=1",
$thisDialog = $(this).closest('.dialogBody').empty();
$.ajax({
type: "POST",
url: ajaxUrl,
success: function(response){
$thisDialog.html(response);
console.log(response);
}
})
});
您还需要在移除ajaxUrl
元素之前将this
作业移至。