Question

以下代码在我请求页面时给出了类似this的错误，它返回404.相反，它应该会显示警告。有什么奇怪的是只在上已经被ajaxed的链接上执行此操作，在没有更新/更改它的链接上工作正常。

('.page-wrap').append('<img src="img/graphics/ajax-loader.gif" class="ajax-loader" />');

    var target = $('section.content'),
        siteURL = 'http://' + top.location.host.toString(),
        internalLinks = $("a[href^='"+siteURL+"'], a[href^='/'], a[href^='./'], a[href^='../'], a[href^='#']"),
        links = $('a'),
        URL,
        el,
        mainContent,
        headContent,
        headClasses,
        pageName,
        ajaxSpinner = $('.ajax-loader');
    internalLinks.click(function(e) {

        el = $(this);

        URL = el.attr('href');

        $('.current_page_item').removeClass('current_page_item');
        el.addClass("current_link").parent().addClass("current_page_item");

        ajaxLoader(URL, false);

        e.preventDefault();

    });

    function ajaxLoader(location, isHistory) {
            $("html, body").animate({ scrollTop: "0px" });
            ajaxSpinner.show();
            $('.page-wrap').css('opacity', '0.5}');


            // Load New Page
            $.get(location, function(data) {
                mainContent = $('section.content', data).html();
                headContent = $('.feature-content', data).html();
                pageName = $('.page-name', data).html();
                headClasses = $('header', data).attr('class');
                $('section.content').html(mainContent);
                $('.page-name').html(pageName);
                $('.feature-content').html(headContent);
                if (headClasses) {
                    $('header').attr('class', headClasses);
                } else {
                    $('header').removeClass();
                }
                if (!isHistory) {
                    history.pushState(location, '', location);
                }

                $(resizeHeader);

                ajaxSpinner.fadeOut();
            }).error(function() {
                alert('woops'); // or whatever
            });
    }
    w.bind('popstate', function(event) {
        if (event.originalEvent.state !== null ) {
            ajaxLoader(event.originalEvent.state, true);
        }
    });

Answer 1

初步想法

您的成功处理程序代码中的某些内容是否会导致某种错误？也许注入第一次成功时间返回的任何html导致脚本第二次失败？
您认为在您的Fiddler / Firebug / F12开发者工具中看到了什么 - 您正在使用其中一种，对吧？ :)密切关注任何控制台错误......

第二个想法

你使用的是什么jQuery版本？

我用jq 1.8.2对此进行了测试，错误处理程序对我来说效果很好，但如果这是一个JSONP请求，它将不会触发error（）函数。我接受了你的代码的要点：

$.get(
               "404MeBaby.html", function (data) {
                   $(".result").html(data);
                   console.log(data);
               }
            ).error(
            function (x) {
                console.log("well that didn't go so well...");
            });

来自API：

从jQuery 1.5开始，成功的回调函数也传递了一个 “jqXHR”对象（在jQuery 1.4中，它传递了XMLHttpRequest 宾语）。但是，由于JSONP和跨域GET请求不使用 XHR，在那些情况下传递给jqXHR和textStatus参数成功回调未定义。

您可以尝试使用$.ajax，因为它可以提供更多控制权。或者，您可以设置jQuery全局ajax选项，如here所示，它将影响所有$ .get调用，但如果相关，请记住JSONP的诅咒！

处理错误时，jQuery $ .get返回白色错误页面

1 个答案: