divを開いたままページを変更しますか？

Question

私はdivの 'フッター'をページの最後に残そうとしていましたが、ページの変更によって開いたままにしておきます。私はJQueryの.load関数をメインのコンテンツdivで使用してこれを実現しましたが、そのメソッドを使用すると、誰かが別のページに移動したときにURLが同じままになります。リンクをURLに変更しても、divを開いたままにする方法はありますか？私は上記のdivを使って音楽を演奏することを計画しているので、ページスイッチの間を閉じることができない、または音楽が停止/再バッファリングする必要があります。

Answer 1

あなたは使ってHTML5でこれを行うことができます：あなたの​​呼び出しの後

window.history.pushState(obj, "Title", url); 

を。

表示されたURLが通話のURLと一致するように変更されますが、同じドメインに属するURLだけが許可されます。

は、あなたが非HTML5のブラウザをサポートしたい場合は、フレームとハッシュURLを使用する必要がありますhttps://developer.mozilla.org/en/DOM/Manipulating_the_browser_history

Answer 2

を参照してください。私は昔ながらのフレームセットを使用したいと思います。 （私は実際にフレームセットを提案しているとは信じられません。これは悪い習慣と考えられていますし、おそらく11年後にこのようなコードを書いていないのですが、この場合実際には正しい解決策のようです。が、私は）

<frameset border="0" rows="*,100"> 
    <frame src="/mainPage" id="content" /> 
    <frame src="/footer" id="footer" /> 
</frameset> 

使用Ben Almanのhashchange pluginフレームセットは、実際にはより理にかなっていると思うし、ページナビゲーションを管理するには、このようなスクリプトを使用します。

$(function() { 
    $("frame").load(function() { 
     document.title = w.document.title; 
     var links = $("a[href]", this.contentWindow.document); 
     links.attr("target", "_top"); 
     links.click(function (e) { 
      if (this.hostname == location.hostname) { 
       e.preventDefault(); 
       var path = this.pathname.replace(/^[^\/]/, "$&/"); 
       location.hash = "#" + path + this.search + this.hash; 
      } 
     }); 
    }); 
    var w = $("#content")[0].contentWindow; 
    $(window).hashchange(function() { 
     var hash = location.hash.substr(1) || "/mainPage"; 
     var contentLoc = w.location.pathname + w.location.search + w.location.hash; 
     if (hash.toLowerCase() != contentLoc.toLowerCase()) { 
      w.location.replace(hash); 
     } 
    }).trigger("hashchange"); 
}); 

デモ：http://jumpingfishes.com/framed/

フレームの代わりに、AJAXを使用してコンテンツをリロードすることもできますが、フレームを実装する方が早いかもしれません。