浅谈localStorage的用法
今天接到一个任务，说是让自动调节textarea标记的输入高度，而且还要记录下来，下次登录的时候还是调节后的高度，我第一时间就想到了localStorage的用法，直接代码献上：
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="pg_reset.css"> //我自己的公共样式
<style>
textarea{
width: 700px;
height: 154px;
border: 1px solid #4f90c2;
box-sizing: border-box;
}
</style>
</head>
<body>
高度：<select id="txtHeight">
<option value="0.4">0.4倍</option>
<option value="0.6">0.6倍</option>
<option value="0.8">0.8倍</option>
<option value="1" selected>1倍</option>
<option value="1.2">1.2倍</option>
<option value="1.4">1.4倍</option>
<option value="1.6">1.6倍</option>
</select>
<div>
<textarea id="textarea1"></textarea>
</div>
<div>
<textarea id="textarea2"></textarea>
</div>
<script src="jquery-1.11.3.js"></script>
<script>
var objText=$.fn.objText={
id1:'#textarea1',//上面一个本文的id值
id2:'#textarea2',//下面一个文本的id值
txtId:'#txtHeight',//select选择框的id值
height:154,//对应的是textarea初始的时候设置的高度 两个高度最初始的时候应该是一样的
init:function () {
$(this.txtId).val(window.localStorage.txtHg);
this.winFun();
this.start();
},
start:function () {
var _this=this;
$(_this.txtId).change(function () {
window.localStorage.txtHg=$(this).val();
_this.winFun();
});
},
winFun:function () {
$(this.id1).css({
height:this.height*window.localStorage.txtHg+'px'
});
$(this.id2).css({
height:(this.height*2-$(this.id1).height())+'px'
});
}
};
objText.init();
</script>
</body>
</html>
有时间可以关注一下我的博客，有好的意见也希望大家多交流，技术在于讨论中进步：http://www.cnblogs.com/laiqiangjin
