問題タブ [html5-history]

このデモをクリックしてcontent（index.php？id = id）クリックしてsubject（index.php）に戻ります。

Q1。（index.php？id = id）直接リンクcontentページは利用できません。（index.php）と表示されますsubject。なぜですか？

Q2。2回目（進む>戻る>進む>戻る）の後に戻るをクリックすると、URLの変更が停止します。なぜですか？（Safari 5）更新：window.onpopstateURLの使用は正常に機能します。このエラーは発生しません。

任意の提案をいただければ幸いです。

デモ

index.php

Google Chromeで少量のベースタグ（html、body、headなど）を含む空白のHTMLページを開いて、コンソールで次のコマンドを実行しようとしました。

履歴イベントは正常に機能しますが、ページタイトルは変更されません。大丈夫ですか？毎回手動で変更する必要がありますか？必要な場合、タイトルのようなpushState（）メソッドにそのようなパラメーターがあるのはなぜですか？

アンカータグをクリックするとdjaxをいじっていますが、ページソースを表示するとURLも変更されますが、ページソースを表示してもページ自体の内容は変更されませんでした。

ここにマークアップのスニペットがあります

クリックすると URL が変更されますが、結果は表示されませんが、ページ ソースを表示すると、適切なマークアップが表示されます (または、thankyou.jsp のマークアップと言うべきでしょうか)。

これがjsコードであるコードです

あいまいなタイトルで申し訳ありませんが、これらの手順を再現することで、私が抱えている問題が表示されることを願っています。

1. Google Chrome で、griffinalters.comにアクセスします(Firefox や IE の最近のバージョンでは問題はないようです)。
2. 任意のカードをクリックします。
3. 別のサイトにアクセスします (これには about:blank が適しています)。
4. 戻ってみると、部分的なリクエストに対して読み込まれた HTML だけが表示されるはずです (たまたまhttp://www.griffinalters.com/card/29/?ajaxのようになります)。

pushState したリンクは でし/card/29/たが、div にロードしたリンクは(この回答/card/29/?ajaxの提案に従って) でした。もともと私はinの存在をチェックしようとしていました(価値があるので、私は Django の方法を使用しています)。XMLHTTPRequestHTTP_X_REQUESTED_WITHis_ajax

XHR から返された HTML のチャンクを次のようにロードします。

これは次のように呼び出されます。

私が本当に理解したいのは、別のサイトからヒットバックすると、プッシュした URL が読み込まれず、フェッチされた URL が読み込まれる理由です。誰かが私を正しい方向に向けることができますか?

それは良い質問ではないかもしれませんが、ウェブサイト上のすべてのリンクを、ウェブページの更新からユーザーがAJAX経由でクリックしたURLの読み込みに変更することが、どういうわけか簡単かつ迅速に（おそらく1つの機能で）可能でしょうか？

私のウェブサイトにはどこにでも標準のリンクがありますが、iPhone用のモバイルアプリケーションが必要な場合は、どこでもAJAX（およびおそらくHTML5 History API）を使用する必要があります。リンクによってSafariブラウザが開くためです。

ブラウザウィンドウを更新せずに、すべてのリンクをすばやく変換して現在のソースコードを削除し、新しいページを読み込む方法はあると思いますか？それとも、リンクのすべてのセットに対して手動のコーディングと個別の機能が必要ですか？

例：

それは可能だと思いますか、それともここに落とし穴がありますか？

コンテンツのajaxロードでHTML5履歴APIを試しています。

相対リンクで接続されたテストページがたくさんあります。私はこれらのリンクのクリックを処理するこのJSを持っています。リンクがクリックされると、ハンドラーはそのhref属性を取得し、それをajaxLoadPage（）に渡します。この属性は、要求されたページから現在のページのコンテンツ領域にコンテンツをロードします。（私のPHPページは、通常どおりリクエストすると完全なHTMLページを返すように設定されていますが、リクエストのURLに？fragment = trueが追加されている場合は、コンテンツのチャンクのみが返されます。）

次に、クリックハンドラーがhistory.pushState（）を呼び出して、アドレスバーにURLを表示し、ブラウザーの履歴に追加します。

pushStateを使用して履歴にURLを追加する場合は、戻るボタンまたは進むボタンのクリックを処理するために、popstateイベントのイベントハンドラーも含める必要があります。（これを行わない場合、戻るをクリックすると、アドレスバーに履歴にプッシュしたURLが表示されますが、ページは更新されません。）したがって、私のpopstateハンドラーは、作成した各エントリのstateプロパティに保存されたURLを取得します。そしてそれをajaxLoadPageに渡して、適切なコンテンツをロードします。

これは、クリックハンドラーが履歴に追加されたページで問題なく機能します。しかし、「通常」にリクエストしたときにブラウザが履歴に追加したページはどうなりますか？通常どおり最初のページにアクセスし、ajaxの読み込みを行うクリックでサイト内を移動するとします。その後、履歴を最初のページに戻そうとすると、最後のクリックで最初のページのURLが表示されますが、表示されません。ブラウザにページをロードしません。何故ですか？

これは、最後のpopstateイベントのstateプロパティと関係があることがわかります。値を与えることができるのはpushState（）またはreplaceState（）によって履歴に追加されたエントリのみであるため、そのイベントの状態プロパティはnullです。しかし、ページの最初の読み込みは「通常の」リクエストでした。ブラウザが元のURLに戻って通常どおりに読み込まないのはなぜですか？

HTML5履歴APIを使用してページ情報をナビゲートおよびリロードするサイトがあります。これにより、関連するページ情報を取得するAJAX呼び出しが送信されます。私の「連絡先」ページには、グーグルマップのAPIスクリプトがあります。URLにアクセスしてページをロードすると、正常に機能します。GoogleはmapsAPIを読み込み、bodyタグを閉じる前にそれを含めます。

ページから移動して（履歴APIを使用してコンテンツを削除および追加）、連絡先ページに戻ると（再び履歴APIを介して）、（すでに含まれている）マップAPIが2回呼び出され、2倍になります。 。これにより、コンソールに警告メッセージが表示されます。

新しいコンテンツが読み込まれる前に、bodyを閉じるタグの前に追加されたGoogle Mapsスクリプトを削除しようとしましたが、スクリプトが解析されたため、マップに関連するすべての関数がブラウザのメモリに残ります。

だから私の質問は、「ページコンテンツのAJAXリクエストを行うときにすべてのグーグルマップJSをアンロードする方法はありますか？」ということだと思います。

コンソールメッセージは次のとおりです。

警告：このページにGoogleMapsAPIを複数回含めています。これにより、予期しないエラーが発生する可能性があります。

を使用して、別のページにリダイレクトするページを持つ Android webview がありますlocation.replace(url)。
ページ「B」にリダイレクトするページ「A」があるとします (location.replace を使用)。ページ「B」から「戻る」ボタンを押すと、ページはページ「A」に戻り、ページ「B」に再びリダイレクトされます。履歴 API (history.length) をデバッグすると、ページ "B" で長さが "1" 増加したことがはっきりとわかります (Android 4.X webview のみ。iOS / Web ブラウザー / Android 2.X ではこれはバグです。(location.replace は history.length を変更すべきではありません!)

In my single-page backbone app, I'm having trouble getting my longer urls to route properly in IE. Any urls that are nested more than one level, don't receive the proper hash fallbak when loading them directly.

top-level urls work fine...

navigating (in-app) works fine...

but accessing deeper urls directly breaks the page

UPDATE:

This is IE9

次の 2 つの URL があります (私は単一ページのアプリを使用しているため、実際のページではサポートされていません)。

解決策: 連結を防ぐために、URL は「/」から開始する必要があります。

1. C/D
2. T

pushState()上記の URL を渡して を 2 回呼び出すとmysite.com/C/T、2 回目の呼び出しの後にmysite.com/T.

pushState()URL の連結を防ぐにはどうすればよいですか?