通过js当中的cookie实现可以记住内容的表单

最新推荐文章于 2020-11-26 11:45:23 发布

mituan1234567

最新推荐文章于 2020-11-26 11:45:23 发布

阅读量2.2k

点赞数

分类专栏： JavaScript JQuery

JQuery 同时被 2 个专栏收录

104 篇文章 1 订阅

订阅专栏

64 篇文章 0 订阅

订阅专栏

http://blog.sina.com.cn/s/blog_7256fe8f01017q0j.html

在上边的两个文本框当中输入我们的值，当我们点击刷新页面的时候，下边的两个框会自动填充上我们的内容，因为我们cookie设置的保存的时间是默认值，因此关闭浏览器之后就没了。

目前在ie和火狐下正常显示，谷歌浏览器暂时无法获取。

通过js当中的cookie实现可以记住内容的表单

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>可以记住内容的表单(js cookie)</title>

<script>

//将我们的数据加载到页面当中

function loadData(){

if(read_cookie("text3")){

$("text3").value=read_cookie("text3");

}

if(read_cookie("text4")){

$("text4").value=read_cookie("text4");

}

}

//下边的是我们读我们的cookie

function read_cookie(key){

var str,ary;

str=document.cookie;

//该函数的作用是将我们分号前后的空格去掉 g表示的是在输入字符串中查找所有可能的匹配，返回的结果可以是多个如果不加/g只会匹配一个

ary=str.replace(/ *; */g,";").split(";");

key=escape(key)+"=";

for(var i=0;i<ary.length;i++){

if(ary[i].indexOf(key)==0){

//返回我们的键值

return ((ary[i].split("=")[1]));

}

}

}

function saveData(){

//将键值写入

write_cookie("text3",$("text1").value);

write_cookie("text4",$("text2").value);

}

//写入我们的cookie

function write_cookie(key,value,cookieDomain,cookiePath,expireTime,targetWindow){

//我们的cookie信息

var strAppendix="";

strAppendix+=cookieDomain?";domain="+cookieDomain:"";

strAppendix+=cookiePath?";path="+cookiePath:"";

strAppendix+=expireTime?";expires="+expireTime:"";

targetWindow=targetWindow?targetWindow:top;

targetWindow.document.cookie=escape(key)+"="+escape(value)+strAppendix;

}

function $(str){

return (document.getElementByIdx_x_x(str));

}

</script>

</head>

<body οnunlοad="saveData()" οnlοad="loadData()">

<h3>通过js cookie实现可以记住内容的表单</h3>

<table style="font-family: '楷体';">

<tr>

<td>普通文本框</td>

<td><input type="text" id="text1"></td>

</tr>

<tr>

<td>普通文本框</td>

<td><input type="text" id="text2"></td>

</tr>

<tr>

<td>可以记住内容的文本框1</td>

<td><input type="text" id="text3"></td>

</tr>

<tr>

<td>可以记住内容的文本框2</td>

<td><input type="text" id="text4"></td>

</tr>

<tr>

<td><button type="submit">提交</button></td>

<td><button οnclick="alert(document.cookie)">查看cookie</button></td>

</tr>

</table>

</body>

</html>

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
通过js当中的cookie实现可以记住内容的表单

http://blog.sina.com.cn/s/blog_7256fe8f01017q0j.html在上边的两个文本框当中输入我们的值，当我们点击刷新页面的时候，下边的两个框会自动填充上我们的内容，因为我们cookie设置的保存的时间是默认值，因此关闭浏览器之后就没了。目前在ie和火狐下正常显示，谷歌浏览器暂时无法获取。可以记住内
复制链接

扫一扫

专栏目录

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。