ページリロード時のsetTimeout機能の無効化

Question

私はBootstrap 3.3.6で動作しています。私は10秒後にポップアップウィンドウを起動する非常に単純なsetTimeout関数を持っています。

setTimeout(function(){ 
     $('#myModal').modal('show'); 
     }, 10000); 

私はこのスクリプトをホームページの最後に追加しました。このコードは完全に機能し、ポップアップ（#myModal）はうまくいきます。

問題は、自分のサイトの別のページにアクセスしてから戻るボタンを押すか、ナビゲーションバーのホームをクリックすると、ポップアップが再び発生します。

ここでは、localStorageを使用してif/elseとして実行する方法についての回答が見つかりました。基本的には、最初にそのページにアクセスしたときにポップアップが表示されるようにします。しかし、私は非常にjavascriptに新しいです、そして、私はそれを正しく得るのに苦労しています。誰かがここで私を助けることができますか？

Answer 1

は、私はこのような単純なアプローチを使用します。

// load flag from localStorage 
 
var alreadyDisplayed = localStorage.getItem('alreadyDisplayed'); 
 

 
// if not found or found but 'false' - display modal (alert in this case) 
 
if (!alreadyDisplayed || alreadyDisplayed == 'false') { 
 

 
    setTimeout(function() { 
 
    alert('show'); 
 
    // store to localStorage the fact that we displayed the modal 
 
    localStorage.setItem('alreadyDisplayed', 'true'); 
 
    
 
    }, 5 * 1000); // in ms, so 5*1000 = 5 secs 
 
}

Answer 2

まあ、私はそれがクッキーを作成し、それをチェックするかもしれない行うための一つの方法を考えます。おそらく、あなたの家のページのスクリプトでは、このようなクッキーを作成することができます。

window.onload = function() { 
 
    
 
    
 
    if (!document.cookie){ 
 
     setTimeout(function(){ 
 
      $('#myModal').modal('show'); 
 
      }, 10000); 
 
     document.cookie = "cookie=yes; path=/"; 
 
    } 
 
    
 

 
}

を、私はきちんとすべてをやった場合、どのようなこれが最初にすべきことは「そこにISNかどうかを確認ですクッキー。クッキーがない場合は、モーダルアラートが消え、「cookie」という名前と「yes」という名前のクッキーが作成されます。このクッキーの最大経過時間は指定していないので、ユーザーがサイトを離れると期限切れになるはずです（私は思う）。また、一般的なパスを設定しているので、このCookieはすべてのページにわたって保持されます。