首页 > 代码库 > 用js实现保存文本框信息

用js实现保存文本框信息

2024-07-22 08:19:17   220人阅读

看知乎等大型网站都实现自动保存文本框内容，我就用js简单地实现这个功能，用到了onblur事件跟onload事件，保存到本地cookie（为减轻服务器负担，一般人都不加用session来做吧？）

<body onl oad="savecontent()"><script type="text/javascript">function savecontent(){	var kk="";	var content=document.getElementById("text").value;	if(content.length>1)	{	setCookie("ct",content,30);	//document.cookie="ct="+content;	if((kk=getCookie("ct")).length>0)	{		 //alert(kk);		document.getElementById("text").value=http://www.mamicode.com/kk;"tips").innerHTML="内容已自动保存！！！";	}	}	else if(content.length<1&&((kk=getCookie(‘ct‘)).length>0))	{		document.getElementById("text").value=http://www.mamicode.com/kk;"=" +escape(value)+((expiredays==null) ? "" : ";expires="+exdate.toGMTString())}function getCookie(c_name){　　　　if (document.cookie.length>0){　　//先查询cookie是否为空，为空就return ""　　　　　　c_start=document.cookie.indexOf(c_name + "=")　　//通过String对象的indexOf()来检查这个cookie是否存在，不存在就为 -1　　　　　　　　if (c_start!=-1){ 　　　　　　　　c_start=c_start + c_name.length+1　　//最后这个+1其实就是表示"="号啦，这样就获取到了cookie值的开始位置　　　　　　　　c_end=document.cookie.indexOf(";",c_start)　　//其实我刚看见indexOf()第二个参数的时候猛然有点晕，后来想起来表示指定的开始索引的位置...这句是为了得到值的结束位置。因为需要考虑是否是最后一项，所以通过";"号是否存在来判断　　　　　　　　if (c_end==-1) c_end=document.cookie.length　　　　　　　　　　return unescape(document.cookie.substring(c_start,c_end))　　//通过substring()得到了值。想了解unescape()得先知道escape()是做什么的，都是很重要的基础，想了解的可以搜索下，在文章结尾处也会进行讲解cookie编码细节　　　　　　} 　　　　}　　　　return ""　　}　　</script><form id="form1" name="form1" method="post" action="">  <p>    <label for="text"></label>    <textarea name="text" id="text" cols="45" rows="5" onblur="savecontent()"></textarea>  </p>  <p>    <input type="submit" name="button" id="button" value="http://www.mamicode.com/提交" />  <span id="tips"></span></p></form></body>

　　其中setcookie跟getcookie懒得写，直接用到w3cshool和博友这篇文章的：http://www.cnblogs.com/Darren_code/archive/2011/11/24/Cookie.html

 注意：在不定义站点的情况下会在chrome下失效（已测试ie、chrome、火狐，ie与火狐通过）

用js实现保存文本框信息


联系
我们