javascript - H5 localstorage
本文介绍了javascript - H5 localstorage的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
问 题
图中左边的的input的val值为对应下标th列的宽度，可以手动调节，但是调节过后怎么存储他们的值，这样下次登陆(或者刷新)这个界面就是上一次设置好的值。
解决方案
谢邀~
这个还没解决吗?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="jquery.min.js"></script>
<style>
.item{
background: green;
color: white;
height: 50px;
width: 50px;
display: inline-block;
text-align: center;
line-height: 50px;
}
</style>
</head>
<body>
<div id="test">
</div>
<input type="text" class="itemInput" id="name0" />
<input type="text" class="itemInput" id="name1" />
<input type="text" class="itemInput" id="name2" />
<input type="text" class="itemInput" id="name3" />
<button onclick="setItemFun()">点我保存</button>
<script>
var localStorage = window.localStorage;
var arrKey = ["name0", "name1", "name2", "name3"];
function checkLocal(){
if(localStorage.getItem(arrKey[0])){
for (var i = 0; i < arrKey.length; i++) {
var tempvalue = localStorage.getItem(arrKey[i])
$("#test").append("<div class='item'>" + tempvalue + "</div>");
$(".itemInput").eq(i).val(tempvalue);
}
}
}
function setItemFun(){
for(var i = 0; i < $(".itemInput").length; i ++){
localStorage.setItem("name" + i, $(".itemInput").eq(i).val())
}
}
$(function(){
checkLocal();
});
</script>
</body>
</html>这篇关于javascript - H5 localstorage的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
