ダイアログなしでページの離脱前に処理を追加したい（ダイアログなしのaddEventLister beforeunload）

前提・実現したいこと

ページ離脱（前に戻る、次に進む、閉じる、リロードなど）の前に一定の処理をしたいと考えてます。
そのため、window.addEventListener("beforeunload", function (event) {})を以下のように使いました。が、処理が終わればページを離脱して構わないのでダイアログを出さなくても構わないどころか出ない方が良いのですが、その方法がわかりません。

例えていえば、クラスの承継してメソッドに追加処理をした後superするようなイメージです。

ダイアログを出さない方法を教えてください。趣旨が実現できれば別のイベント処理でも構いません。

該当のソースコード

sample.html

html
1<html lang="ja">
2  <head>
3    <meta charset="UTF-8">
4    <script src="sample.js"></script>
5  </head>
6  <body>
7    <div>
8      <button>Button</button>
9    </div>
10  </body>
11</html>

sample.js

javascript
1window.addEventListener("beforeunload", function (event) {
2  event.preventDefault();
3  event.returnValue = '';
4  console.log("kicked");
5});

補足情報（FW/ツールのバージョンなど）

HTML5

行動規範の内容に同意します

回答1件

ベストアンサー

event.returnValue = ''; の行を消してみてください。

ダイアログが表示される理由は、event.returnValue に値が設定されているためです。
自分も詳細な仕様は未確認なのですが、空文字を設定してもダイアログが表示されてしまうようです。

投稿2019/11/08 16:30

2KOH

総合スコア999

NCC1701

2019/11/09 11:59

うまくいきませんでした。 event.preventDefault(); ① event.returnValue = ''; ② の行を消す（①だけ消す、②だけ消す、両方消すの3とおり）とダイアログは出ないのですが、console.log("kicked");が実行されませんでした（つまりなんの処理もできない）

2KOH

2019/11/09 12:19

ページ遷移したり、ページをリロードしたりすると、コンソールの内容は消えてしまいます。なので、console.log("kicked"); は実行されていないのではなく、実行された次の瞬間に消えてしまっているだけという可能性があります。 console.log ではなく、例えば localStorage に何かしらの値を書き込むなどで、実行されているかどうかを確認できると思います。それでも実行されていないようであれば、またコメントしてください。

NCC1701

2019/11/10 10:03

Firefoxの永続ログを利用したらconsole.logでの出力を確認できました。ありがとうございました。

行動規範の内容に同意します