6

クライアント用の検索ページを作成しましたが、この場合、実際の検索ページは にiframeあり、ユーザーには前述の を囲む装飾的なシェルが表示されiframeます。これにより、その URL パラメータが に渡され、それがiframe解釈されて検索が実行されます。 . これは私が変えることのできないものです。また、ユーザーが検索ページの検索バーに入力して別の検索を実行すると、iframe は更新されますが、シェル ページは更新されないという固有の問題も発生します。これは、URL が現在の検索に関連しなくなったことを意味します。このシェル ページから移動せずに、アドレス バーの URL を変更するにはどうすればよいですか? このシステムの要点は、待ち時間が少ないことです。iframeページ全体よりも更新する必要があるため、ページ全体を更新すると逆効果になります。

フルソリューション

コード スニペットだけが必要な人のために、Ian のソリューションの最終的な実装を次に示します。

<?PHP
// ...
function buildTitleChanger($search) {
    ?>

    window.top.history.pushState({search : "<?PHP echo str_replace("\"", "\\\"", $search); ?>"}, document.title, window.location.search);
    window.top.document.title = document.title;<?PHP
}
// ...
?>

そのインライン PHP では少し汚れていますが、100% の確率で動作します :3

4

1 に答える 1

8

のようなもので URL の一部を変更できますwindow.pushState。MDN の説明を見てみましょう。

https://developer.mozilla.org/en-US/docs/DOM/Manipulating_the_browser_history

ブラウザの互換性: http://caniuse.com/history

これらの機能をラップし、それをサポートしていないブラウザで同様の機能を提供する素晴らしいライブラリは history.js です: http://balupton.github.io/history.js/demo/

MDN リンクからの例:

例

http://mozilla.org/foo.html次の JavaScript を実行するとします。

var stateObj = { foo: "bar" };
history.pushState(stateObj, "page 2", "bar.html");

これにより、URL バーが表示されますhttp://mozilla.org/bar.htmlが、ブラウザは読み込まれず、存在bar.htmlを確認することさえできませんbar.html。

ユーザーが に移動しhttp://google.com、クリックして戻ったとします。この時点で、URL バーに が表示されhttp://mozilla.org/bar.html、ページはpopstate状態オブジェクトに のコピーが含まれるイベントを取得しますstateObj。ページ自体は のようになりますが、イベントfoo.html中にページの内容が変更される場合があります。popstate

もう一度クリックすると、URL が に変わりhttp://mozilla.org/foo.html、ドキュメントは別のpopstateイベントを取得します。今回は null 状態オブジェクトです。ここでも、前の手順に戻っても、ドキュメントの内容は前のステップの内容から変更されませんが、ドキュメントはpopstateイベントの受信時に手動で内容を更新する可能性があります。

于 2013-04-25T06:01:03.093 に答える