Question

我有以下代码通过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错误的那一刻，我显示警报对于普通用户来说是无用的。当我没有使用警报显示任何错误时，用户不知道发生了什么。也许我错了，但在这种情况下最好的是简单的＆＃34;没有违约＆＃34;应该重新加载不使用AJAX的网站是什么意思。

我已经看过例如Best way to remove an event handler in jQuery?，但是当我在错误函数的开头添加时：

$(document).off('click', '.internal_link');

这使得我必须再次单击链接以重新加载页面而不使用AJAX。

此外，当我添加此功能时

return true;

网站未使用AJAX重新加载。

有没有办法做到这一点？

Answer 1

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
            }
        });
    });

});

出错时没有阻止默认 - 重新加载页面不使用AJAX

1 个答案: