Показывать всплывающее окно

Question

У меня есть всплывающее окно, которое появляется, когда вы идете на мой сайт - это предупреждающий знак. Я только хочу, чтобы он появился при первом посещении, а не снова. В настоящее время каждый раз, когда я нажимаю кнопку «Обновить» или возвращаюсь на главную страницу, она появляется.

Вот код JavaScript (Как только кто-то нажимает кнопку 'Предупреждение Enter'):

<script> 
"use strict" 
warning_popup(); 

function warning_popup() { 
    addEventListener('load', start); 

    function start() { 
     // popup block background 
     var bkg = document.createElement("div"); 
     bkg.id = "warning-background"; 
     document.body.insertBefore(bkg, document.body.firstChild); 

     // popup window 
     var box = document.createElement("div"); 
     box.id = "warning-window"; 
     document.getElementById("warning-background").appendChild(box); 

     // warning title 
     var title = document.createElement("div"); 
     title.id = "warning-title"; 
     title.className = "page-title-wrapper page-title"; 
     title.innerHTML = "<h1>Binge Eating Disorder<\h1>"; 
     document.getElementById("warning-window").appendChild(title); 

     // warning description 
     var desc = document.createElement("div"); 
     desc.id = "warning-desc"; 
     desc.className = "page-desc"; 
     desc.innerHTML = "<p>Binge Eating Disorder is disease that I take very seriously.<p>"; 
     document.getElementById("warning-window").appendChild(desc); 

     // warning button enter 
     var enter = document.createElement("div"); 
     enter.id = "warning-enter"; 
     enter.className = "page-desc"; 
     enter.innerHTML = "<p>View</p>"; 
     document.getElementById("warning-window").appendChild(enter); 


     // warning button back 
     //var back = document.createElement("div"); 
     //back.id = "warning-back"; 
     // back.className = "page-desc"; 
     // back.innerHTML = "<p>Take Me Back</p>"; 
     // document.getElementById("warning-window").appendChild(back); 

     // listens for button clicks 
     document.querySelector("#warning-enter").addEventListener("click", function() { 
      document.querySelector("#warning-background").style.visibility = "hidden"; 
     }); 
     document.querySelector("#warning-back").addEventListener("click", function() { 
      window.history.back(); 
     }); 
    } 
} 

Answer 1

Я думаю localStorage может решить вашу проблему. Рассмотрим следующий пример:

window.onload = init; 

function init() { 
    if (localStorage.getItem('first_time') === "undefined" || localStorage.getItem('first_time') === null) { 
    // Set the storage key and show the warning—but only this one time 
    localStorage.setItem('first_time', true); 
    showWarning(); 
    } 
} 

function showWarning() { 
    console.log("Showing warning..."); 
} 

Загрузка этот код будет только огонь showWarning функцию один раз.

https://jsfiddle.net/ez2qqpbx/