JS:Cookie的寫入和讀取
阿新 • • 發佈:2018-12-09
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>
執行: