1. ホーム
  2. javascript

[解決済み] 位置情報ハッシュの変化を検出するにはどうすればよいですか?

2022-03-17 02:35:32

質問

ナビゲーションにAjaxとhashを使用しています。

をチェックする方法はありますか? window.location.hash はこのように変更されましたか?

http://example.com/blah #123 まで http://example.com/blah #456

ドキュメント読み込み時にチェックすると動作するのですが。

しかし、#hashベースのナビゲーションがあると、ブラウザの戻るボタンを押したときに機能しません(つまり、blah#456からblah#123にジャンプします)。

アドレスボックスの中に表示されるのですが、JavaScriptでキャッチできないのです。

解決方法は?

これを本当に行う唯一の方法(そして 'reallysimplehistory' がこれを行う方法)は、現在のハッシュをチェックし続ける間隔を設定し、以前と比較することです。これを行い、購読者に、ハッシュが変更された場合に発行する変更イベントを購読させるのです。


この回答を新鮮に保つために更新しました。

もしあなたがjQueryを使っているのなら(今日、ほとんどの人にとって基礎になるはずです)、jQueryのイベントシステムを使ってwindowオブジェクトのhashchangeイベントをリスンすることで、素晴らしい解決策を得ることができます。

$(window).on('hashchange', function() {
  //.. work ..
});

ここで素晴らしいのは、hashchangeのサポートについて心配する必要のないコードを書けることです。しかし、あまり知られていないjQueryの機能という形で、いくつかの魔法をかける必要があります。 jQueryの特別なイベント .

この機能により、誰かが何らかの方法でそのイベントを使おうとしたときに、そのイベントに対するセットアップコードを実行することができます (イベントへのバインディングなど)。

このセットアップ コードでは、ブラウザのネイティブ サポートをチェックし、ブラウザがネイティブに実装していない場合は、変更をポーリングするタイマーを 1 つ設定して、jQuery イベントをトリガーすることができます。

これは、このサポート問題を理解する必要からあなたのコードを完全に解放します。この種の特別なイベントの実装は(単純な98%動作するバージョンを得るために)些細なことですが、なぜそのようなことをするのでしょうか? 他の人がすでに .