如何停止当前的 ajax 连接并启动新的连接？
我有一个聊天框，它将使用 ajax 在我的内容页面上加载新消息，并且每 20 秒就会监听一次新消息。它正在发挥作用。但是，现在我有另一个链接，允许用户加载以前的消息。尽管我已经对现有的 ajax 函数执行了clearTimeout()，但该按钮似乎不起作用。知道为什么吗？
我的脚本：
//for loading previous messages
var timer;
$('#getoldmessages').click(function() {
$("#workroom_boxes_chatpast").html('<img src="{{ MEDIA_URL }}images/ui-anim_basic_16x16.gif"/> Loading...');
$.ajax({
url: "/messages/{{ chat.key.id }}",
cache: false,
success: function(html){
$("#chatcontent").html(html);
$("#workroom_boxes_chatpast").html('Loaded');
}
});
clearTimeout(timer);
});
//for new messages
function updateMsg() {
$.ajax({
url: "/recent/messages/{{ chat.key.id }}",
cache: false,
success: function(html){
$("#chatcontent").html(html);
}
});
//alert('repeating');
t = setTimeout(updateMsg, 20000);
}
updateMsg();
i have a chat box that will load new messages using ajax on my content page and it will listen for new ones every 20s. It is working. However, right now i have another link that will allow a user to load previous messages. And that button does not seem to work even though i have already done a clearTimeout() on the existing ajax function. any idea why?
My scripts:
//for loading previous messages
var timer;
$('#getoldmessages').click(function() {
$("#workroom_boxes_chatpast").html('<img src="{{ MEDIA_URL }}images/ui-anim_basic_16x16.gif"/> Loading...');
$.ajax({
url: "/messages/{{ chat.key.id }}",
cache: false,
success: function(html){
$("#chatcontent").html(html);
$("#workroom_boxes_chatpast").html('Loaded');
}
});
clearTimeout(timer);
});
//for new messages
function updateMsg() {
$.ajax({
url: "/recent/messages/{{ chat.key.id }}",
cache: false,
success: function(html){
$("#chatcontent").html(html);
}
});
//alert('repeating');
t = setTimeout(updateMsg, 20000);
}
updateMsg();
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
setTimeout(this, 20000);已损坏，this引用该上下文中的 jquery 对象，而不是函数。检查你的 JavaScript 控制台，你会看到一个错误。您不需要
clearTimeout来进行单独的 ajax 调用。此外，您的调用可能不起作用，因为您引用的是变量timer，该变量具有对setTimeout的 first 调用的超时 ID，但是任何连续的调用都会返回一个新的 id。因此，您需要在updateMsg中添加变量赋值：timer = setTimeout(updateMsg,20000);。如果您的初始代码在与
updateMsg分开的$()块中执行，则计时器将仅在该块中可见，并在updateMsg中更改它code> 不会有效果，另一个问题。如果是这样，请将timer设置为全局，或者将其附加到全局对象，或者将updateMsg放入该$()块中。最后，无论如何，您应该使用
setInterval，而不是每次都调用setTimeout，这就是它的用途。setTimeout(this, 20000);is broken,thisrefers to a jquery object in that context, not a function. Check your javascript console and you'll see an error.You don't need to
clearTimeoutto make a separate ajax call. Moreover, your call might not work because you're referring to the variabletimerwhich has the timeout id from the first call tosetTimeout, but any successive call will return a new id. So you need to add in yourupdateMsgthe variable assignment:timer = setTimeout(updateMsg,20000);.If your initial code is being executed in a
$()block separate fromupdateMsg, then timer will only be visible in that block and changing that inupdateMsgwon't have an effect, another problem. If so, either maketimerglobal, or attach it to a global object, or putupdateMsgin that$()block.Lastly, you should be using
setIntervalanyway, instead of recallingsetTimeoutevery time, that's what it is made for.