NEW ARTICLE
kotlin エラー「error: no set method providing array access」の解決方法
  1. HOME
  2. javascript
  3. javascript リロードを検知する方法

javascript リロードを検知する方法

javascript リロードを検知する方法

javascriptで画面がリロードされたことを検知するためのサンプルコードを記述してます。

目次

環境

  • OS windows10 pro 64bit
  • Apache 2.4.43
  • ブラウザ chrome 102.0.5005.63
Javascript サンプル集はこちら

リロード検知

「window.performance.navigation.type」を使用することで判別することが可能です。

「window.performance.navigation.type」 の戻り値は、ページの読み込みが何によるものかを判定することができます。

【戻り値】
0 : リンクのクリックから
1 : リロード
2 : 履歴から
255 : 上記以外の定義

if (window.performance) {
  if (window.performance.navigation.type === 1) {
    alert("リロードされました");
  }
}

実行結果

※以下の画像のように文字化けする場合は「meta charset=”utf-8″」を使用してみてください。

<head>
  <meta charset="utf-8">
</head>

<script>
if (window.performance) {
  if (performance.navigation.type === 1) {
    alert("リロードされました");
  }
}
</script>

また「window」オブジェクトは省略可能です。

if (performance) {
  if (performance.navigation.type === 1) {
    alert("リロードされました");
  }
}