Angularを使用してブラウザのバックボタンクリックイベントを検出するには?
2023-07-23 05:12:43
質問
ユーザーがブラウザの履歴の戻るボタンを使ってページに入ったことを検出することは可能でしょうか?できればangular.jsを使用してこのアクションを検出したいです。
angularのルーティングは使いたくありません。ユーザーがフォームを送信し、サーバーへの送信とリダイレクトが成功した後、ユーザーがブラウザのバックボタンを使用してフォームに戻った場合にも動作する必要があります。
どのように解決するのですか?
Angularを使った解決方法を紹介します。
myApp.run(function($rootScope, $route, $location){
//Bind the `$locationChangeSuccess` event on the rootScope, so that we dont need to
//bind in induvidual controllers.
$rootScope.$on('$locationChangeSuccess', function() {
$rootScope.actualLocation = $location.path();
});
$rootScope.$watch(function () {return $location.path()}, function (newLocation, oldLocation) {
if($rootScope.actualLocation === newLocation) {
alert('Why did you use history back?');
}
});
});
私はこれをキックスタートさせるためにランブロックを使っています。まず、$rootScope.actualLocationに実際の場所を保存し、次に$locationChangeSuccessをリッスンして、それが起こったときにactualLocationを新しい値で更新しています。
rootScopeで、位置パスの変更を監視し、新しい位置がpreviousLocationと同じであれば、$locationChangeSuccessが発生しなかったので、ユーザーが履歴を使用したことを意味します。
関連
-
[解決済み] ページロード時にAngularJSのコントローラ関数を実行する方法は?
-
[解決済み] 要素外でのクリックを検出するにはどうすればよいですか?
-
[解決済み] どのラジオボタンが選択されているかをjQueryで知るにはどうしたらよいですか?
-
[解決済み] フォーム送信のようなJavaScriptのポストリクエスト
-
[解決済み] Safari、Chrome、IE、Firefox、Operaのブラウザを検出する方法は?
-
[解決済み] jQueryを使用してキーボードのEnterキーを押したことを検出する方法は?
-
[解決済み] chromedriverでSeleniumを使用していることをWebサイトで検出することは可能ですか?
-
[解決済み】ブラウザの戻るボタンのイベントを検出する方法 - クロスブラウザ編
-
[解決済み] Node.jsでbase64エンコードされた画像をAmazon S3へアップロードする
-
[解決済み] 文字列がhtmlであるかどうかをチェックする
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] JavaScriptで:hoverのCSSプロパティを変更する
-
[解決済み] 文字列がhtmlであるかどうかをチェックする
-
[解決済み] javascript includes() 大文字小文字を区別しない
-
[解決済み] react-routerのハッシュフラグメントからクエリパラメータを取得する
-
[解決済み] モデルフェッチ時に1をtrueに、0をfalseに変換する方法
-
[解決済み] Promise : then vs then + catch [重複].
-
[解決済み] Chromeのwebkitインスペクタで「Unsafe JavaScript attempt to access frame with URL...」というエラーが継続的に発生する。
-
[解決済み] jQueryを使用して、すべてのクリックイベントハンドラを削除するにはどうすればよいですか?
-
[解決済み] JavaScriptとLuaの微妙な違い [終了しました]
-
[解決済み] JavaScriptデータフォーマット/プリティプリンタ