模拟新浪微博textarea,刷新页面输入信息保留
今天我们的产品经理提出一个新需求,模拟新浪微博textarea框,输入内容刷新页面保留信息。
我是用的方法是Html5 LocalStorage存储的,开始计划用cookie、或mysql存储,尝试了一番后发现都不行,mysql存储需要无数的ajax请求不合实际。cookie感觉也不太好,随后上网查LocalStorage这种方法。
发现了上面2篇文章后果断的使用了LocalStorage,发现这个存储方式只针对浏览器级别的,换个浏览器就不能读取保存数据了,但还是满足了产品的需求,
我首先测试了这段代码
if(window.localStorage){ alert('This browser supports localStorage'); }else{ alert('This browser does NOT support localStorage'); }
发现大部分浏览器都支持这个功能,随后就开始开发起来
1 #实例一下存储 2 var storage = window.localStorage; 3 #绑定textarea事件,只要有输入就保存起来 4 $("#comsay0").bind('input propertychange', function() { 5 storage.setItem("comment_top",escape($(this).val())); 6 }); 7 #判断是否存在记录 有就显示出来 8 var aa = storage.getItem("comment_top"); 9 if (aa) { 10 $("#comsay0").val(unescape(aa)); 11 } 12 $("#comsay0").each(function() { 13 $(this).one("click", function() { 14 if (aa) { 15 $("#comsay0").val(unescape(aa)); 16 } else { 17 $(this).val(""); 18 } 19 }) 20 });
alex kong