問題が発生しました。作成しているサイトでHistory.jsを実装しています

Question

私はhistory.jsを私が抱えている問題の可能な解決策として見つけました。私が構築しているウェブサイトについては、私のコンテンツがロードされる静的なページを作成することに決めました。だから、私は3つのDivsを持っています（ヘッダー用、メニューバー用、コンテンツ用）。メニューのリンクをクリックすると、そのページがコンテンツdivに読み込まれます。このため、すべてのトラフィックはindex.phpページにとどまるので、戻るボタンをクリックすると最後に訪問したコンテンツが最後に訪れたページに移動します。その私の理解私はhistory.jsでこれを解決することができます。

私のページには、メニューバーにいくつかのリンクがあり、onclickに関数が呼び出されています。たとえば、

<li><a href="javascript:void(0);" onclick="myprofile()" ><span>my profile</span></a></li> 
    <li><a href="javascript:void(0);" onclick="mysettings()"><span>Settings<small> 

関数は次のようになります。

function myprofile() { 
$('#content').load('members.php'); 
} 
function mysettings() { 
$('#content').load('settings.php'); 
} 

私は（このフォーラムにあります）history.jsためのいくつかのJavaScriptを追加し、それは私のindex.php内のURLを変更するが、バックをクリックしたときに、それがページをロードするdoes notのんが。関数の使用時にhistory.jsを動作させるにはどうすればよいですか？

<script> 
        $(function() { 

    // Prepare 
    var History = window.History; // Note: We are using a capital H instead of a lower h 
    if (!History.enabled) { 
     // History.js is disabled for this browser. 
     // This is because we can optionally choose to support HTML4 browsers or not. 
     return false; 
    } 

    // Bind to StateChange Event 
    History.Adapter.bind(window,'statechange',function() { // Note: We are using statechange instead of popstate 
     var State = History.getState(); 
     $('#content').load(State.url); 
     /* Instead of the line above, you could run the code below if the url returns the whole page instead of just the content (assuming it has a `#content`): 
     $.get(State.url, function(response) { 
      $('#content').html($(response).find('#content').html()); }); 
     */ 
     }); 


    // Capture all the links to push their url to the history stack and trigger the StateChange Event 
    $('a').click(function(evt) { 
     evt.preventDefault(); 
     History.pushState(null, $(this).text(), $(this).attr('onclick')); 
    }); 
}); 
</script> 

Answer 1

History.pushStateの最初のパラメータは、追加情報のためである、「データ」、である（私はいくつかのリンクは本当にただのリンク内のonloadイベントを置く機能は私のためのオプションではありません必要があります）。

ですから、あなたのクリックイベントでこれを行うことができます履歴エントリを保存するには：

History.pushState({ href: 'members.php' }, $(this).text(), $(this).attr('onclick')); 

そしてそれを読み戻す時に、あなたのHistory.Adapter.bind機能でこれを行うだろう：

$('#content').load(State.data.href);