jQuery $ .get возвращает белую страницу ошибки при обработке ошибок

Question

Следующий код дает мне ошибку, например this, когда я запрашиваю страницу, и она возвращается 404. Вместо этого она должна вызывать предупреждение. Странно, что это делает это только по ссылкам, которые были добавлены в, на ссылки, которые не обновляют/не изменяют, отлично работают.

('.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 global ajax, как показано на рисунке here, что повлияет на все вызовы $ .get, но помните проклятие JSONP, если это необходимо!