h5本地存储

2018-08-14  本文已影响0人  毛子阿卡西
//保存数据
        function save(){
            var contact = new Object;
            contact.user_name = document.getElementById("user_name").value;
            contact.mobilephone = document.getElementById("mobilephone").value;
            contact.company = document.getElementById("company").value;
            var str = JSON.stringify(contact);
            localStorage.setItem(contact.mobilephone,str);
            loadAll();
        }
        //将所有存储在localStorage中的对象提取出来,并展现到界面上
        function loadAll(){
            var list = document.getElementById("list");
            if(localStorage.length>0){
                var result = "<table border='1'>";
                result += "<tr><td>姓名</td><td>手机</td><td>公司</td></tr>";
                for(var i=0;i<localStorage.length;i++){
                    var mobilephone = localStorage.key(i);
                    var str = localStorage.getItem(mobilephone);
                    var contact = JSON.parse(str);
                    result += "<tr><td>"+contact.user_name+"</td><td>"+contact.mobilephone+"</td><td>"+contact.company+"</td></tr>";
                }
                result += "</table>";
                list.innerHTML = result;
            }else{
                list.innerHTML = "目前数据为空,赶紧开始加入联系人吧";
            }
}
上一篇 下一篇

猜你喜欢

热点阅读