javascript jquery ajax帖子取消
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10990607/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery ajax post canceled
提问by hsemu
I want to track the mouse click events on a set of UI components on a set of pages. To do this, I am using the following jquery/ajax call(trimmed out u):
我想跟踪一组页面上一组 UI 组件上的鼠标单击事件。为此，我使用了以下 jquery/ajax 调用（删除了 u）：
1.Ajax call which will add the click logging.
1.Ajax 调用将添加点击记录。
myClickLogger = {
endpoint: '/path/to/my/logging/endpoint.html',
logClickEvent: function(clickCode) {
$.ajax({
'type': 'POST',
'url': this.endpoint,
'async': true,
'cache': false,
'global': false,
'data': {
'clickCode':clickCode
},
'error': function(xhr,status,err){
alert("DEBUG: status"+status+" \nError:"+err);
},
'success': function(data){
if(data.status!=200){
alert("Error occured!");
}
}
});
}
};
2.JQuery click event which will call the ajax logger(the clickCode is an identifier for which button/image was clicked):
2.JQuery 点击事件将调用 ajax 记录器（clickCode 是按钮/图像被点击的标识符）：
$(document).ready(function() {
$(".myClickEvent[clickName]").click(function() {
var clickCode = $(this).attr("clickName");
myClickLogger.logClickEvent(clickCode);
});
});
The above ajax call(1.) is "canceled" by browser whenever the button click being tracked takes to a new page.
每当被跟踪的按钮点击进入一个新页面时，上面的 ajax call(1.) 就会被浏览器“取消”。
If I change 'aysnc' to 'false', then the ajax call succeeds.
如果我将 'aysnc' 更改为 'false'，则 ajax 调用成功。
Also, click events which do not take to a new page succeed. Only the click events taking to new page are being canceled.
此外，不会进入新页面的点击事件也会成功。只有进入新页面的点击事件被取消。
I do not want to make the call synchronous.
我不想使调用同步。
Any ideas, what could be the issue? How can I guarantee that the asynchronous call before is finished when the click event takes to a new page?
任何想法，可能是什么问题？当点击事件进入新页面时，如何保证之前的异步调用完成？
回答by Dan Crews
Because it's async, the code will complete before the logging ever happens. What you'll want to do is pass a callback into the async call. This will preserve the async properties, but still allow you to leave. Something like this:
因为它是异步的，代码将在日志记录发生之前完成。您要做的是将回调传递给异步调用。这将保留异步属性，但仍允许您离开。像这样的东西：
logClickEvent: function(clickCode, callback) {
$.ajax({
'type': 'POST',
'url': this.endpoint,
'async': true,
'cache': false,
'global': false,
'data': {
'clickCode':clickCode
},
'error': function(xhr,status,err){
alert("DEBUG: status"+status+" \nError:"+err);
},
'success': function(data){
if(data.status!=200){
alert("Error occured!");
} else {
callback();
}
}
});
}
$(document).ready(function() {
$(".myClickEvent[clickName]").click(function(e) {
e.preventDefault(); // This will prevent the link from actually leaving right away
var clickCode = $(this).attr("clickName");
var href = $(this).attr('href');
myClickLogger.logClickEvent(clickCode, function(href){
if (href)
window.location = href;
});
});
});
You'll probably want to modify the callback for any links that aren't leaving the page, when it's not necessary.
在没有必要时，您可能希望修改任何未离开页面的链接的回调。
回答by Ilia G
Are you using Firebug to track requests? If so, that is not entirely correct. If you use Fiddler to examine requests, you can see they are successful. Cancelled status mostly means "browser cancelled waiting for response", which you don't really care about anyway.
您是否使用 Firebug 来跟踪请求？如果是这样，那并不完全正确。如果您使用 Fiddler 检查请求，您可以看到它们是成功的。取消状态主要表示“浏览器取消等待响应”，无论如何您并不真正关心。
回答by alanjds
I fixed using CORSheaders on the AJAX called endpoint server.
我在称为端点服务器的 AJAX 上使用CORS标头进行了修复。
See also: http://blogs.mulesoft.org/cross-domain-rest-calls-using-cors/
Also: http://www.biodalliance.org/cors.html
另见：http: //blogs.mulesoft.org/cross-domain-rest-calls-using-cors/
另见：http: //www.biodalliance.org/cors.html
