用ajax替换html代码,替换Ajax响应一个div的内部HTML(Replace inner HTML of a div w

这篇博客讨论了在JavaScript中使用Ajax更新div元素的内部HTML时遇到的问题。作者指出,由于异步性质,`this`关键字在回调函数中的上下文发生了变化,导致无法正确替换内容。文中提供了四种不同的解决方案,包括使用闭包保存`this`的引用,以及利用jQuery的`each()`方法中的第二个参数。这些解答帮助开发者理解如何在Ajax请求成功后正确地更新DOM元素。
摘要由CSDN通过智能技术生成

我试图一些时间间隔后改变一个div的内部HTML。 我得到我想要使用Ajax正确的反应。 但无法取代内HTML的后,并用Ajax响应地选择。 什么是错我的代码..

HTML

51 seconds agoimage

58 seconds agoimage

.

.

.

.

.

10 minute agoimage

Ĵ查询

setInterval(function() {

$( ".time" ).each(function( index ) {

var sendTime= $(this).attr("data-time");

dataString = "sendtime="+sendTime+"&q=convertTime";

$.ajax({

type: "POST",

url: "data_handler.php",

data: dataString,

cache: true,

success: function(response) {

alert(response);

$(this).html(response);

//alert(response);

}

});

});

}, 5000);

Answer 1:

this是在回调的窗口。 使用给予的价值callback每个:

$( ".time" ).each(function(index , elem) {

var sendTime= $(this).attr("data-time");

dataString = "sendtime="+sendTime+"&q=convertTime";

$.ajax({

type: "POST",

url: "data_handler.php",

data: dataString,

cache: true,

success: function(response) {

alert(response);

$(elem).html(response);

}

});

});

你并不需要定义一个新的变量来保护this在jQuery已经为您完成。

Answer 2:

当您使用的是异步函数的回调, this在你的回调并非来自同一背景。 您需要保存this在回调中使用的变量。

尝试这样的:

setInterval(function() {

$( ".time" ).each(function( index ) {

var sendTime= $(this).attr("data-time");

dataString = "sendtime="+sendTime+"&q=convertTime";

var self = this;

$.ajax({

type: "POST",

url: "data_handler.php",

data: dataString,

cache: true,

success: function(response) {

alert(response);

$(self).html(response);

//alert(response);

}

});

});

}, 5000);

Answer 3:

我认为,$(这)是断章取义。 尝试:

setInterval(function() {

$( ".time" ).each(function( index ) {

var $this = $(this);

var sendTime= $(this).attr("data-time");

dataString = "sendtime="+sendTime+"&q=convertTime";

$.ajax({

type: "POST",

url: "data_handler.php",

data: dataString,

cache: true,

success: function(response) {

alert(response);

$this.html(response);

//alert(response);

}

});

});

}, 5000);

Answer 4:

setInterval(function() {

$( ".time" ).each(function( index ) {

var sendTime= $(this).attr("data-time");

var _thisvariable = $(this);

dataString = "sendtime="+sendTime+"&q=convertTime";

$.ajax({

type: "POST",

url: "data_handler.php",

data: dataString,

cache: true,

success: function(response) {

alert(response);

_thisvariable.html(response);

//alert(response);

}

});

});

}, 5000);

文章来源: Replace inner HTML of a div with Ajax response

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值