标签:属性 key值 gif button table mail storage div 数据
<table> <tr> <td>姓名</td> <td><input type="text" id="name"/></td> </tr> <tr> <td>emall</td> <td><input type="text" id="email"/></td> </tr> <tr> <td>号码</td> <td><input type="text" id="tel"/></td> </tr> <tr> <td>备注</td> <td><input type="text" id="memo"/></td> </tr> <tr> <td></td> <td> <input type="button" value="保存" onclick="saveStorage();" /> </td> </tr> </table> <p> 检索:<input type="text" id="find" /> <input type="button" value="检索" onclick="findStorage(‘msg‘);"/> </p> <p id="msg"> </p>
<script>
function saveStorage(){
var data = new Object();//创建一个对象
data.name = document.getElementById("name").value;//获取的值已创建对象属性的方式保存下来
data.email = document.getElementById("email").value;
data.tel = document.getElementById("tel").value;
data.memo = document.getElementById("memo").value;
var str = JSON.stringify(data);//将对象转换为json格式的字符串
localStorage.setItem(data.name,str);//以key:velue形式存储
console.log(msg)//空的p
}
function findStorage(id){
var find = document.getElementById(‘find‘).value; //获取输入的key值
var str = localStorage.getItem(find);//利用ley值将字符串取出来
/*alert(find);*/
var data = JSON.parse(str);//将数据转换为对象
var result = "姓名:"+data.name+"<br>";//
result+="email:"+data.email+"<br>";
result+="tel"+data.tel+"<br>";
result+="memo"+data.memo+"<br>";
var target =document.getElementById(id);
target.innerHTML = result;
console.log(msg)//将数值放入id=msg的p中
}
</script>
标签:属性 key值 gif button table mail storage div 数据
原文地址:http://www.cnblogs.com/jin-000/p/6775263.html