Question

我很确定这里有一个非常简单的解决方案，但我似乎无法想到最好的方法。我正在使用History.js，它使用History API。让我们说我从下一页开始：

<div ="header">
  Header
</div>
<div id="content">
  Content
</div>
<div id="footer">
  Footer
</div>

我处理AJAX调用的方法是用新的html替换#content的内容。例如，我加载了“内容2”的文本。这一切都很有效，直到用户导航回到他们在我的网站上的第一页，因为它试图加载完整的第一页（包括#header和#footer，所以我最终得到：

<div ="header">
  Header
</div>
<div id="content">
  <div ="header">
    Header
  </div>
  <div id="content">
    Content
  </div>
  <div id="footer">
    Footer
  </div>
</div>
<div id="footer">
  Footer
</div>

我知道有一种更好的方法来构建我的页面以避免这个问题，但我似乎无法弄清楚它是什么。这是我正在使用的代码：

(function(window,undefined){
    var
    History = window.History,
    State = History.getState();

    History.Adapter.bind(window,'statechange',function(){
    var State = History.getState();
    $.ajax({
        url: History.getState().url,
        cache: false
    }).done(function( html ) {
        $("#content").html(html);
    });
    });
})(window);

有关处理此问题的正确方法的任何想法吗？

Answer 1

<?php

    $is_ajax = isset( $_SERVER['HTTP_X_REQUESTED_WITH'] ) && ( $_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest' );

    if ( $is_ajax ) {
      // Give the content
    } else {
      // Give a full page
    }

?>

我应该如何处理回到使用History API时加载的初始页面

1 个答案: