關於H5中存儲sessionStorage的一些用法

最近在用H5作一個項目。其中有一個需求是在tab欄列表頁點擊列表數據進入詳情頁，當點擊詳情頁的返回按鈕時可以返回列表頁而且不刷新數據同時還要保留原tab欄的狀態。而後就開始想出一系列想法~~

在這裏先說一下sessionStorage的用法:

一、setItem存儲value:（代碼示例）

sessionStorage.setItem("key", "value");//sessionStorage.setItem("name", "zhansan");

二、getItem獲取value：（代碼示例）

 var value = sessionStorage.getItem("key"); //var name = localStorage.getItem("name")

說明一點sessionStorage的特性：本地存儲，關閉瀏覽器的時候，數據就會被清除，若是你想要用它作到頁面之間傳值的話，須要用到a連接，否則是取不到數據的，你能夠本身去試試~

再來講一下上面的需求怎樣解決呢？

解決辦法：

列表頁tab欄的狀態可用sessionStorage存儲
var hash = sessionStorage.setItem("status',hash)；
...
...
hash= sessionStorage.getItem('status')
if(hash==0){
  $("li").addClass('active').sibings().removeClass("active")
}else if(hash==1){
  $("li").addClass('active').siblings().removeClass('acctive');
}else if(hash==2){
  ...
}

   在tab列表頁給數據添加a連接到你要跳轉的頁面，點擊返回按鈕的時候使用瀏覽器的返回api

$(".arrow").on("click",function () {    window.history.back()})