2017-04-07 51 views
1

我正在爲我的html應用程序創建一個歡迎屏幕。並即時使用github的welcomescreen插件。你可以在這裏檢查它https://github.com/valnub/welcomescreen.js本地存儲值在頁面刷新時更改

現在我想顯示當localstorage值爲0時的歡迎屏幕,當點擊關閉按鈕的welcomescreen時,我正在將localstorage值更改爲1,但頁面刷新localstorage值再次設置爲0.

該怎麼做,這是我的js文件。

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

 
// Init method 
 

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

 
    $(document).ready(function() {  
 
     var options = { 
 
      'bgcolor': '#0da6ec', 
 
      'fontcolor': '#fff', 
 
      'onOpened': function() { 
 
      console.log("welcome screen opened"); 
 
\t   console.log(welcomeTour); 
 
     }, 
 
     'onClosed': function() { 
 
      localStorage.setItem("welscreen","1"); 
 
\t  var welcomeTour = localStorage.getItem("welscreen"); 
 
\t  console.log("welcome screen closed"); 
 
\t  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(); 
 
    });  
 
    }); 
 
}; 
 
});

+2

當然它設置爲'0',你這樣做,在這裏每次:'localStorage的.setItem(「welscreen」,「0」);'。你需要檢查它是否已經存在。 – Arg0n

+0

,因爲本地存儲變量是在document.ready上設置的。每次準備好文檔時將其設置爲零。它的工作原理是 – sainu

回答

4

更改此:

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"; 
} 
+0

。非常感謝。 –

相關問題