为什么jQuery的.load()会触发两次？

Question

我正在使用jQuery 1.4和jQuery History，并试图弄清楚为什么Firebug/Web Inspector在每次页面加载时都显示2个XHR GET请求（当访问我的网站主页（/或/#）时，数量会增加一倍）。

例如，启用Firebug并访问此页面（或任何页面）。

以下是编辑/相关代码（请参见完整源代码）：-

$(document).ready(function() {

    $('body').delegate('a', 'click', function(e) {
        var hash = this.href; 
        if (hash.indexOf(window.location.hostname) > 0) { /* Internal */
         hash = hash.substr((window.location.protocol+'//'+window.location.host+'/').length); 
         $.historyLoad(hash); return false;     
  } else if (hash.indexOf(window.location.hostname) == -1) { /* External */ 
   window.open(hash); return false; 
  } else { /* Nothing to do */ }
        });


 $.historyInit(function(hash) {
  $('#loading').remove(); $('#container').append('<span id="loading">Loading...</span>'); 
   $('#ajax').animate({height: 'hide'}, 'fast', 'swing', function() { 
    $('#page').empty(); $('#loading').fadeIn('fast');

    if (hash == '') { /* Index */ 
     $('#ajax').load('/ #ajax','', function() { ajaxLoad(); }); 
    } else {
        $('#ajax').load(hash + ' #ajax', '', function(responseText, textStatus, XMLHttpRequest) {
      switch (XMLHttpRequest.status) { 
       case 200: ajaxLoad(); break;
       case 404: $('#ajax').load('/404 #ajax','', ajaxLoad); break; // Default 404
       default: alert('We\'re experiencing technical difficulties. Try refreshing.'); break;
       }
      });
     }

}); // $('#ajax')
  }); // historyInit()


  function ajaxLoad() {
   $('#loading').fadeOut('fast', function() { 
    $(this).remove(); $('#ajax').animate({height: 'show', opacity: '1'}, 'fast', 'swing');
    });
   }

    });

以下内容可能有所帮助： - 使用默认/标准的.htaccess与WordPress - 我仅通过JavaScript（PE）将/links-like/this重定向到/#links-like/this - 我是通过window.location.replace(addr);而不是window.location=addr;来实现上述功能的 - 如有需要，请随时访问我的网站。

提前感谢您。

- LeslieOA

Answer 1

我认为你已经回答了自己的问题：

"我只通过JavaScript将/links-like/this重定向到/#links-like/this（PE）"

注：PE代表某个人或团队的缩写。

- Paulo Santos

---

不行，我试过了。我是在页面头部使用纯JS来做这个操作，代码如下：<script type="text/javascript">l = window.location.protocol + '//' + window.location.host + '/'; ll=l.length; e=window.location.toString(); if(e.substr(ll, 1) != '#') { g = e.substr(ll-1,1) + '#' + e.substr(ll); window.location.replace(g); } </script>将window.location.replace(g);注释掉仍然有相同的效果。还有其他建议吗？ 无论如何，谢谢保罗。 - LeslieOA

Answer 2

我最初发布的代码示例可能有助于回答我的问题...

在我的实际网站上，.load() 嵌套在两个级别的回调中：

$.historyInit(function(hash) {
    $('html, body').animate({scrollTop: '0'}, 500, 'swing', function() { \\ level 1
        $('#loading').remove(); $('#container').append('<span id="loading">Loading...</span>'); 
        $('#ajax').animate({height: 'hide'}, 'fast', 'swing', function() { \\ level 2
            $('#page').empty(); $('#loading').fadeIn('fast');

            if (hash == '') { /* Index */ 
                $('#ajax').load('/ #ajax','', function() { ajaxLoad(); }); 
            } else {
                $('#ajax').load(hash + ' #ajax', '', function(responseText, textStatus, XMLHttpRequest) {
                    switch (XMLHttpRequest.status) { 
                        case 200: ajaxLoad(); break;
                        case 404: $('#ajax').load('/404 #ajax','', ajaxLoad); break; // Default 404
                        default: alert('We\'re experiencing technical difficulties. Try refreshing.'); break;
                        }
                    });
                }

            }); // $('#ajax')
        }); // $('html, body')
    }); // historyInit()

......将if (hash)语句移出回调函数，使得所有页面的XHR GET请求次数降至1次（仅/为例外）。

再次感谢您的帮助，Paulo。

- LeslieOA