我有以下代码通过AJAX加载数据:
$().ready(function() {
$('a:not(.flags a)').filter(function() {
return this.hostname && this.hostname === location.hostname;
}).addClass('internal_link');
$(document).on('click', '.internal_link', function(e) {
var url = $(this).attr('href');
$.ajax({
url: url,
dataType: 'json',
success: function(data) {
contentWrapper = $('<div />').html(data.content);
$(contentWrapper).find('a').filter(function() {
return this.hostname && this.hostname === location.hostname;
}).addClass('internal_link');
document.title = data.meta_title;
$('#articlecontent').fadeOut(400, function()
{
$(this).fadeOut('slow').html(contentWrapper.html()).fadeIn('slow');
});
$('nav li a').removeClass('selected');
$('#nav_'+data.code).addClass('selected');
$('meta[name=keywords]').attr('keywords', data.meta_keys);
$('meta[name=description]').attr('description', data.meta_desc);
$("html, body").animate({ scrollTop: 0 }, "slow");
},
error: function(jqXHR, exception) {
if (jqXHR.status === 0) {
alert('Not connect.n Verify Network.');
} else if (jqXHR.status == 404) {
alert('Requested page not found. [404]');
} else if (jqXHR.status == 500) {
alert('Internal Server Error [500].');
} else if (exception === 'parsererror') {
alert('Requested JSON parse failed.');
} else if (exception === 'timeout') {
alert('Time out error.');
} else if (exception === 'abort') {
alert('Ajax request aborted.');
} else {
alert('Uncaught Error.n' + jqXHR.responseText);
}
}
});
e.preventDefault();
});
});
为了测试的目的,我准备了PHP输出以显示在错误Requested JSON parse failed.
中。在AJAX错误发生的那一刻,在我显示警报的那一刻,对于普通用户来说是无用的。当我使用警报不显示任何错误时,用户将不知道发生了什么。也许我错了,但最好的是在这种情况下简单的"unprevent default"意味着网站应该重新加载不使用AJAX。
我已经看到,例如最好的方式来删除一个事件处理程序在jQuery?但是当我在错误函数的开头添加:
$(document).off('click', '.internal_link');
它使我不得不再次点击链接重新加载页面不使用AJAX。
当我添加这个函数
return true;
如果不使用AJAX,网站不会重新加载。
有办法吗?
Ajax是异步的,所以当错误处理程序触发时,开始删除preventDefault或事件处理程序已经太晚了,但是你可以用javascript重定向,因为它们看起来像锚。
之类的$(document).ready(function () {
var links = $('a:not(.flags a)').filter(function () {
return this.hostname && this.hostname === location.hostname;
});
links.on('click', function (e) {
e.preventDefault();
var url = this.href;
$.ajax({
url: url,
dataType: 'json',
success: function (data) {
// success handler
},
error: function (jqXHR, exception) {
window.location.href = url; // redirect here
}
});
});
});