質問内容
ChromeやEdgeでブラウザの戻るボタンの無効化について調べると、無効化ができなくなっているという情報が出てきます。
実際に以下のソースコードで戻るボタンを無効化できないことは確認しているのですが、ブラウザのDevToolsを使うと
戻るボタンの無効化が機能するようになります。
なぜDevToolsのみ機能するのでしょうか?(効かないコードはDevToolsでも効かなくてよいのではと思います。)
無効化が機能するようになるオペレーションは以下の通りです。
1.「test1」のリンクから「test2」へ遷移、遷移後DevToolsを開く。
2.「test2」のリンクから「test1」へ遷移、遷移後DevToolsを開き、以下のコードをConsoleで実行。
javascript
1history.pushState(null, null, null); 2window.addEventListener('popstate', () => { 3 history.pushState(null, null, null); 4}); 5
ソースコード
html
1<!DOCTYPE html> 2<html lang="ja" dir="ltr"> 3 <head> 4 <meta charset="utf-8"> 5 <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script> 6 <title>test1</title> 7 </head> 8 <body> 9 <p>test1</p> 10 <a href="./test2.html">to test2</a> 11 </body> 12</html> 13
html
1<!DOCTYPE html> 2<html lang="ja" dir="ltr"> 3 <head> 4 <meta charset="utf-8"> 5 <script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script> 6 <title>test2</title> 7 </head> 8 <body> 9 <script type="text/javascript"> 10 $(function() { 11 history.pushState(null, null, null); 12 window.addEventListener('popstate', () => { 13 history.pushState(null, null, null); 14 }); 15 }); 16 </script> 17 <p>test2</p> 18 <a href="./test1.html">to test1</a> 19 </body> 20</html> 21 22
補足情報(FW/ツールのバージョンなど)
Google Chrome バージョン: 92.0.4515.159(Official Build) (64 ビット)
Microsoft Edge バージョン 92.0.902.78 (公式ビルド) (64 ビット)
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2021/08/26 12:19