2013-09-22 2 views
0

다음 코드는 페이지를 요청할 때 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); 
     } 
    }); 
+0

정확히 무엇을 원하니? – Brian

+0

AJAX로 페이지를로드하려고하는데 오류가있는 경우 (예 : 404) 사용자에게 알립니다. 위의 코드는 작동하지만 '.error'부분을 추가하면 에러가 발생합니다. – George

+0

@George,이 줄의 목적은 무엇입니까 :'mainContent = $ ('section.content', data) .html();'etc? 나는 그들이 왜 필요한지 알 수 없다 .... –

답변

1

먼저 생각

  • 인가? 어쩌면 첫 번째 성공적인 시간으로 돌아 오는 html이 삽입 된 것처럼 스크립트가 두 번째 실패하게 만드는 것일까 요?

  • 당신의 Fiddler/Firebug/F12 개발자 도구에서 무엇을 보았습니까? -이 중 하나를 사용하고 있습니까? :)

둘째

어떤 jQuery를 버전을 사용중인

생각 ... 어떤 콘솔 오류에 눈을 계속?

나는 이것을 jq 1.8.2에서 테스트했으며 오류 처리기는 잘 작동하지만 JSONP 요청 인 경우 error() 함수를 트리거하지 않습니다. API에서

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

: 나는 코드의 요점을했다

jQuery를 1.5로, 성공 콜백 함수는 jQuery를 1.4 (A "jqXHR"개체를 전달, 그것은이었다 XMLHttpRequest 객체 전달). 그러나 JSONP 및 교차 도메인 GET 요청은 XHR을 사용하지 않으므로 성공 콜백에 전달 된 jqXHR 및 textStatus 매개 변수는 정의되지 않습니다.

더 많은 제어가 가능하므로 $.ajax을 사용해 볼 수 있습니다. 또는 모든 $ .get 호출에 영향을 미치는 here과 같이 jQuery 전역 아약스 옵션을 설정할 수 있지만 관련성이있는 경우 JSONP의 저주를 기억하십시오!

+0

예상대로 이것은 이것이 나에게 준 오류이다 (http://cl.ly/image/2E2l1Y41051s). 나는 jQuery 1.9.1을 실행 중이다. 나는 그걸 가지고 놀았고 그 줄이 운동했다 : $ ('section.content') .html (mainContent); 오류가 발생합니다. 오류를 일으키는 내 HTML이 있는지 보려면 알 겠지만 그 이유는 확실하지 않습니다. – George

+0

@George, 당신은 그 요소에 주입하고있는 mainContent의 값은 무엇입니까? 코드에서 아약스 타겟을 덮어 씁니까? 그 요소에 쓰여지는 것이 우스운 것이 있는지 봅시다. –

+0

나는이 일을 저에게 해주었습니다. 그것의 단지 HTML.문서가 처음 생성 될 때 링크가 존재하지 않는다는 사실과 관련이있을 수 있습니까? 나는 아약스 이후에 손상되지 않았던 링크 중 하나를 바꾸었고이 결론에 부합한다. 문제를 해결할 수있는 제안 사항이 있으십니까? – George

관련 문제