1,Cookie的写入 2,Cookie的读取
这里用到了document的cookie的方法。目前只支持在不关闭浏览器的情况下。后面再修改。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Cookie的读取</title>
<script language="javascript">
function submit2(){
alert("提交成功");
writeCookie();
return true;
}
function testRadio(){
var charactergroup=document.forms[0].elements["sex"];
for(var i=0;i<charactergroup.length;i++){
if(charactergroup[i].checked==true){
document.cookie=encodeURI("sex="+charactergroup[i].value);
}
}
}
function writeCookie(){
document.cookie=encodeURI("username="+document.form1.username.value);
document.cookie=encodeURI("password="+document.form1.password1.value);
testRadio();
}
function readCookie(){
var cookieString=decodeURI(document.cookie);
if(cookieString.length!=0){
var cookieArray=cookieString.split(";");
for(var i=0;i<cookieArray.length;i++){
var cookieNum=cookieArray[i].split("=");
var cookieName=cookieNum[0];
var cookieValue=cookieNum[1];
alert("Cookie名称为:"+cookieName+" Cookie值为:"+cookieValue);
}
}else
alert("暂时没有Cookie,请填写信息,单击提交按钮");
}
</script>
</head>
<body >
<table width="800" height="689" border="0" align="center">
<form action="" method="post" name="form1">
<tr>
<td background="博客用户注册.jpg">
<table width="800" height="451" border="0">
<tr>
<td height="175" valign="top"><table width="100%" border="0">
<tr>
<td width="30%" class="zi"><div align="right">用户名:</div></td>
<td width="70%" align="center">
<div align="left">
<input name="username" type="text" size="40">
</div></td></tr>
<tr>
<td class="zi"><div align="right">密码:</div></td>
<td>
<div align="left">
<input name="password1" type="password" size="20" oncopy="return false" oncut="return false" onpaste="return false" style="font-family: Wingdings">
</div></td></tr>
<tr>
<td class="zi"><div align="right">性别:</div></td>
<td>
<div align="left">
<input type="radio" name="sex" value="男" checked>
<span class="zi">男</span>
<input type="radio" name="sex" value="女">
<span class="zi"> 女</span>
</div></td></tr>
</table></td>
</tr>
<tr>
<td valign="top"><table width="100%" border="0">
<tr>
<td width="22%"> </td>
<td width="13%"><input type="button" value="提交" width="51" height="20" onClick="return submit2();"></td>
<td width="39%"><input type="button" value="读取Cookie" width="65" height="20" onClick="readCookie();"></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
运行:
3,Cookie的删除
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<script language="JavaScript">
function deleteCookie(name){
var date=new Date();
date.setTime(date.getTime()-10000000);//删除Cookie,实际上是将其过期时间设置为过去的时间
}
</script>
<body>
</body>
</html>