3

サイトを完全な非同期ドキュメントの読み込みに移行したいと考えていますが、#!1)リンクを切断したくない、2)より柔軟な処理方法が必要なため、リクエスト処理の方法を使用したくありません。サイトが取得するURI。

共通スタイルのURL(例:http ://ddrewdesign.com/blog/jquery-is-or-is-child-of-function )で作成できるサイト用の軽量MVCを構築することができました。正しいリクエスト。

私の質問は、これは簡単にできることです。私は何が欠けていますか?#!この方法がユーザーエクスペリエンスの観点からより理にかなっていると思われるのに、なぜGawkerとGoogleが選択したのですか?

編集

明確にするために、元々、私のサイトはmod_rewriteリクエストを取得するためのクエリ文字列メソッド(no)のみを使用していました。これらのリンクはウェブ全体にあり、私はそれらを壊すことはできません。私がハッシュバン法を使用するように移動した場合、彼らはそうなるだろうと私は理解しています。繰り返しますが、これは私の混乱の一部かもしれないので、私がすべてを説明したと言っているわけではありません。これまで読んだことがないので、そのクエリ文字列に対応できるように見えたので、何が欠けているのかを尋ねています。

4

1 に答える 1

3

部分的なページの読み込みを可能にし、javascriptの有無にかかわらず同じURLを持つhistory.pushStateURLを探していると思います。

たとえば、ベースURLがhttp://site.com/With history.pushStateであるとすると、javascriptを使用してページをに変更javascript.htmし、URLをに変更できhttp://site.com/javascript.htmます。

#!サーバー側では#fragmentにアクセスできないため、URLはjavascriptでのみ機能します。ハッシュバンを使用すると、URLは次のようになります。は不要であることにhttp://site.com/#javascript.htm注意してください。!ハッシュの後に何でも設定できるので、urlを設定することもできますhttp://site.com/#!/javascript.htm

残念ながら、IEはhistory.pushStateをサポートしていないため#!、フォールバックとしてURLが必要です。

どちらの方法でも戻るボタンが壊れることはありませんが、URLは方法ごとに異なる方法で設定する必要があります。

シバンは次のように機能します。

function change(){
   //page update logic
}

//hashchange event binding
(typeof window.addeventListener === "function")
    ? window.addEventListener("hashchange", change, false)
    : window.attachEvent("onhashchange", change);

 //This is how the hash is set
 location.hash = "hashstring";

 //Accessing it returns the hashstring, with a #
 location.hash; //returns #hashstring

ページの「状態」をオブジェクトに格納するため、History.pushStateはもう少し複雑です。

この方法に関するいくつかの良い参考資料を次に示します。

どちらの方法でも、JavaScriptページの操作が必要です。これらの種類のURLの例があります。http://timshomepage.net/comic/には、さまざまなWebコミックへのリンクがあり、それらをページのiframeに埋め込みます。javascriptを無効にすると、リンクはhttp://timshomepage.net/comic/dilbertのようになります。history.pushStateを使用すると、同じURLを使用できます。ハッシュバンフォールバックを使用すると、次のようなURLを取得します: http://timshomepage.net/comic/#!/ dilbert

于 2011-06-29T15:51:44.200 に答える