モーダルウィンドウをブラウザ戻るボタンで閉じる javaScriptのaddEventListener

Quick Edit Pencil
モーダルウインドウを開くコマンドに下記を追加
 モーダルウインドウが開かれるとブラウザに履歴を残す/登録する
history.pushState(null, null, location.href);

ウチの場合はコレでイケた
window.addEventListener('popstate', function (e) {
    if (/modalOn/.test(document.body.classList)) {
        alert('ブラウザバックを検知しました。');
        document.body.classList.remove('modalOn');
        let elm = document.querySelector('.modalOpen');
        elm.classList.remove('modalOpen');
        return;
    }
});

あと、モーダルを閉じるコマンドにコレも追加しとく
 履歴が+1より増えない たぶん
window.history.back();

とりあえず、入門的な感じ。かなり奥が深い。

History - Web API | MDN

このブログの人気の投稿

PowerShellのGetDetailsOf メソッドでプロパティの詳細情報のID番号と項目名を列挙します

ヤバい!JAPANNEXT WQHD対応 27型ワイド液晶ディスプレイ「JN-IPS2716WQHD」を注文してみた!!!

googleスプレッドシートで名前範囲内のデータが更新された時にタイムスタンプを更新

googleスライドにリンクした表を更新するスクリプト

blender4.1 レンダリング画像を左右反転する方法

Macの「写真.app」アプリでオリジナルをFinderで表示するAutomatorサービス

Powershell: プロパティの詳細情報インデックスと項目名の列挙