当出现错误时,没有阻止默认-重新加载未使用AJAX的页面

On error no prevent default - reload page not using AJAX

本文关键字:加载 新加载 未使用 AJAX -重 默认 错误      更新时间:2023-09-26

我有以下代码通过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
            }
        });
    });
});