javascript - localstorage 值在页面刷新时更改

Question

我正在为我的 html 应用程序创建一个欢迎屏幕。我使用来自 github 的欢迎屏幕插件。你可以在这里查看https://github.com/valnub/welcomescreen.js

现在我想在 localstorage 值为 0 时显示欢迎屏幕。当单击欢迎屏幕的关闭按钮时，我将 localstorage 值更改为 1。但在页面刷新时，localstorage 值再次设置为 0。

如何做到这一点，这是我的 js 文件。

/*jslint browser: true*/
/*global console, Welcomescreen, $*/

// Init method

$(document).ready(function () {
  localStorage.setItem("welscreen", "0");	
  var welcomeTour = localStorage.getItem("welscreen");
	
  if (welcomeTour == 0) {

    $(document).ready(function () {     
       var options = {
            'bgcolor': '#0da6ec',
            'fontcolor': '#fff',
            'onOpened': function () {
             console.log("welcome screen opened");
	         console.log(welcomeTour);
       },
      'onClosed': function () {
          localStorage.setItem("welscreen","1");
	      var welcomeTour = localStorage.getItem("welscreen");
	      console.log("welcome screen closed");
	      console.log(welcomeTour);
        }
     },
     welcomescreen_slides,
     welcomescreen;

    welcomescreen_slides = [
      {
        id: 'slide0',
        picture: '<div class="tutorialicon">♥</div>',
        text: 'Welcome to this tutorial. In the <a class="tutorial-next-
        link" href="#">next steps</a> we will guide you through a manual that will teach you how to use this app.'
      },
      {
        id: 'slide1',
        picture: '<div class="tutorialicon">✲</div>',
        text: 'This is slide 2'
      },
      {
        id: 'slide2',
        picture: '<div class="tutorialicon">♫</div>',
        text: 'This is slide 3'
      },
      {
        id: 'slide3',
        picture: '<div class="tutorialicon">☆</div>',
        text: 'Thanks for reading! Enjoy this app or go to <a class="tutorial-previous-slide" href="#">previous slide</a>.<br><br><a class="tutorial-close-btn" href="#">End Tutorial</a>'
      }
   ];

  welcomescreen = new Welcomescreen(welcomescreen_slides, options);

  $(document).on('click', '.tutorial-close-btn', function () {
    welcomescreen.close();
  });

  $('.tutorial-open-btn').click(function () {
    welcomescreen.open();  
  });

  $(document).on('click', '.tutorial-next-link', function (e) {
    welcomescreen.next(); 
  });

    $(document).on('click', '.tutorial-previous-slide', function (e) {
       welcomescreen.previous(); 
     });      
   });
 };
});

Answer 1

更改此:

localStorage.setItem("welscreen", "0"); 
var welcomeTour = localStorage.getItem("welscreen");

对此:

var welcomeTour = localStorage.getItem("welscreen");
if(welcomeTour === undefined || welcomeTour === null) {
   localStorage.setItem("welscreen", "0");
   welcomeTour = "0";
}