AjaxコールでpushState？

Question

ブラウザの「戻る」ボタンを使用して「前のページ」に戻ることができるようにクライアントが苦労しています。この「ページ」はAjax経由で呼び出され、コンテンツを表示するモーダルウィンドウになります。私はajaxコールをしています。私はpushStateが私の解決策であることに気付きましたが、実際には得られません。私は少しのアヤックスがない場所を見つけました。それはすべてjavascriptです。だから、ajaxコールにpushStateを追加するにはどうすればよいですか？それも可能ですか？それとも、Ajaxで動作させる方法を見つける必要がありますか？

私はこのことをPjaxと呼んでいましたが、実際には得られません。私のajax呼び出しはこのように見えます。

$(function() { 
    $('.w-container .w-nav-menu a').click(function() { 
     var $linkClicked = $(this).attr('href'); 
     var $pageRoot = $linkClicked.replace('#', ''); 
     if (!$(this).hasClass("active")) { 
      $(".w-container .w-nav-menu a").removeClass("active"); 
      $(this).addClass("active"); 
      $.ajax({ 
       type: "POST", 
       url: "./PATH/load.php", 
       data: 'page='+$pageRoot, 
       dataType: "html", 

       beforeSend: function(){ 
         $('#canvasloader-container.wrapper').show(); 
        }, 
       complete: function(){ 
         $('#canvasloader-container.wrapper').hide(); 
        },     
       success: function(msg){ 
        if((msg)) 
        { 
         $('.content').html(msg); 
         $('.content').hide().fadeIn(); 
        } 
       } 

      }); 
     } 
    event.preventDefault(); 
}); 

、他の誰かがすでにこのようなものを作成した場合は申し訳ありませんが、私はあなたが、あなたが提供するコードでみたいいずれかの段階でpushStateを行うことができます

Answer 1

役に立つ何かを見つけることができませんでしたあなたはいつ歴史を操作したいのかに依存します。

あなただけの成功Ajaxフォームの復帰後にこのようなHTMLコンテンツを交換する前にhistory.pushState([data], [title], [url]);（パラメータとして適切な値とする）だけで行うことができます。

success: function(msg){ 
    if((msg)) 
    { 
     history.pushState([data], [title], [url]); // replace with appropriate values as parameters 
     $('.content').html(msg); 
     $('.content').hide().fadeIn(); 
    } 
} 

「UX、あなたに依存する問題があるかもしれませんユーザーがajax呼び出しによってページに連続してアクセスしていて、その場合に前のページまたは '状態'を反映するURLがない場合、この解決策はおそらくうまくいかないでしょう。

pushStateのような履歴操作機能は、ブラウザの履歴を変更するだけで、誰かが「戻る」ボタンをクリックしたときの動作を制御しません。

セットアップでURLが読み込まれているページがない場合は、ユーザーが '戻る'ボタンをクリックしたときに何が起こるかを制御する必要があります。別のajax呼び出しを実行して以前のコンテンツを読み込みますコンテンツの変化の）それはあなたのシナリオの場合、これはあなたが始めるに役立つかもしれない：https://stackoverflow.com/a/25806609/4283725