JS中利用localStorage防止頁面動態(tài)添加數據刷新后數據丟失
更新時間:2017年03月10日 11:44:39 作者:東都花神
本文給大家分享一段js代碼利用利用localStorage防止頁面動態(tài)添加數據刷新后數據丟失問題,代碼簡單易懂,非常不錯,具有參考借鑒價值,需要的朋友參考下
非常不多說了,直接給大家貼代碼了,具體代碼如下所示:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>Document</title>
<script src="https://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<ul>
<li>555</li>
<li>555</li>
<li>555</li>
<li>555</li>
</ul>
<button>button</button>
<script type="text/javascript">
var arrary_li = document.querySelectorAll("li");
var num;
$('button').on('click', function () {
$('li').last().addClass('active')
for (var i = 0; i < arrary_li.length; i++) {
if (arrary_li[i].className === 'active') {
num = i;
}
}
localStorage.setItem('num', num)
location.reload()
})
var getNum = parseInt(localStorage.getItem('num'));
$('li').eq(getNum).addClass('active');
</script>
</body>
</html>
以上所述是小編給大家介紹的JS中利用localStorage防止頁面動態(tài)添加數據刷新后數據丟失,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持!
您可能感興趣的文章:
- 使用jquery讀取html5 localstorage的值的方法
- JavaScript使用localStorage存儲數據
- JS 中LocalStorage和SessionStorage的使用
- JS中LocalStorage與SessionStorage五種循序漸進的使用方法
- JS實現(xiàn)本地存儲信息的方法(基于localStorage與userData)
- localStorage的黑科技-js和css緩存機制
- JavaScript中l(wèi)ocalStorage對象存儲方式實例分析
- 移動端使用localStorage緩存Js和css文的方法(web開發(fā))
- 詳解JavaScript中l(wèi)ocalStorage使用要點
- Javascript 計算字符串在localStorage中所占字節(jié)數
- JS localStorage實現(xiàn)本地緩存的方法
- JS+HTML5本地存儲Localstorage實現(xiàn)注冊登錄及驗證功能示例
相關文章
事件綁定之小測試 onclick && addEventListener
昨晚回去后,和雷子討論如何才能“檢測”到頁面上某個元素都綁定了哪些事件監(jiān)聽函數,第一感覺就是應該從瀏覽器入手,比如FF,或者Chrome等2011-07-07
JavaScript中ES6規(guī)范中l(wèi)et和const的用法和區(qū)別
這篇文章主要介紹了JavaScript中ES6規(guī)范中l(wèi)et和const的用法和區(qū)別,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2020-08-08
window.onbeforeunload方法在IE下無法正常工作的解決辦法
下面的代碼可以做到不管用戶是點擊了關閉,或者是在任務欄關閉、點擊后退、刷新、按F5鍵,都可以檢測到用戶即將離開的消息。2010-01-01

