JavaScript浏览器编程之——使用Cookie传递参数
ex7.html页面:
代码
1 <html>
2 <head>
3 <title>ex7</title>
4 <style type="text/css">
5 * {margin:0}
6 body {text-align:center;min-width:760px}
7 div {padding:3px 3px 3px 3px}
8 #main {width:720px;margin:0 auto;text-align:left;margin-top:30px}
9 #main div span {width:50px}
10 </style>
11
12 <script type="text/javascript">
13 /***
14 * @param {string} cookieName Cookie名称
15 * @param {string} cookieValue Cookie值
16 * @param {number} nDays Cookie过期天数
17 */
18 function SetCookie(cookieName,cookieValue,nDays) {
19 /*当前日期*/
20 var today = new Date();
21 /*Cookie过期时间*/
22 var expire = new Date();
23 /*如果未设置nDays参数或者nDays为0,取默认值1*/
24 if(nDays == null || nDays == 0) nDays = 1;
25 /*计算Cookie过期时间*/
26 expire.setTime(today.getTime() + 3600000 * 24 * nDays);
27 /*设置Cookie值*/
28 document.cookie = cookieName + "=" + escape(cookieValue)
29 + ";expires=" + expire.toGMTString();
30 }
31 function login() {
32 var username = $("user").value;
33 var password = $("pass").value;
34 /*是否选中7天内无需登录*/
35 var save = $("save").checked;
36 if(username=="sww" && password=="sww") {
37 if(save) SetCookie("username",username,7);
38 else SetCookie("username",username,1);
39 /*跳转到ex8.html页面*/
40 document.location = "ex8.html";
41 } else {
42 alert("用户名或密码错误!");
43 }
44 }
45 function $(id) {
46 return document.getElementById(id);
47 }
48 </script>
49 </head>
50 <body>
51 <div id="main">
52 <div><span>用户名:</span><input type="text" id="user" /></div>
53 <div><span>密码:</span><input type="password" id="pass" /></div>
54 <div>
55 <input type="checkbox" id="save" />
56 7天内无需登录
57 <input type="button" onclick="login()" value="登录" />
58 </div>
59 </div>
60 </body>
61 </html>
2 <head>
3 <title>ex7</title>
4 <style type="text/css">
5 * {margin:0}
6 body {text-align:center;min-width:760px}
7 div {padding:3px 3px 3px 3px}
8 #main {width:720px;margin:0 auto;text-align:left;margin-top:30px}
9 #main div span {width:50px}
10 </style>
11
12 <script type="text/javascript">
13 /***
14 * @param {string} cookieName Cookie名称
15 * @param {string} cookieValue Cookie值
16 * @param {number} nDays Cookie过期天数
17 */
18 function SetCookie(cookieName,cookieValue,nDays) {
19 /*当前日期*/
20 var today = new Date();
21 /*Cookie过期时间*/
22 var expire = new Date();
23 /*如果未设置nDays参数或者nDays为0,取默认值1*/
24 if(nDays == null || nDays == 0) nDays = 1;
25 /*计算Cookie过期时间*/
26 expire.setTime(today.getTime() + 3600000 * 24 * nDays);
27 /*设置Cookie值*/
28 document.cookie = cookieName + "=" + escape(cookieValue)
29 + ";expires=" + expire.toGMTString();
30 }
31 function login() {
32 var username = $("user").value;
33 var password = $("pass").value;
34 /*是否选中7天内无需登录*/
35 var save = $("save").checked;
36 if(username=="sww" && password=="sww") {
37 if(save) SetCookie("username",username,7);
38 else SetCookie("username",username,1);
39 /*跳转到ex8.html页面*/
40 document.location = "ex8.html";
41 } else {
42 alert("用户名或密码错误!");
43 }
44 }
45 function $(id) {
46 return document.getElementById(id);
47 }
48 </script>
49 </head>
50 <body>
51 <div id="main">
52 <div><span>用户名:</span><input type="text" id="user" /></div>
53 <div><span>密码:</span><input type="password" id="pass" /></div>
54 <div>
55 <input type="checkbox" id="save" />
56 7天内无需登录
57 <input type="button" onclick="login()" value="登录" />
58 </div>
59 </div>
60 </body>
61 </html>
ex8.html页面:
代码
1 <html>
2 <head>
3 <title>ex8</title>
4 <script type="text/javascript">
5 /***
6 *读取指定的Cookie值
7 *@param {string} cookieName Cookie名称
8 */
9 function ReadCookie(cookieName) {
10 var theCookie = "" + document.cookie;
11 var ind = theCookie.indexOf(cookieName);
12 if(ind==-1 || cookieName=="") return "";
13 var ind1 = theCookie.indexOf(';',ind);
14 if(ind1==-1) ind1 = theCookie.length;
15 /*读取Cookie值*/
16 return unescape(theCookie.substring(ind+cookieName.length+1,ind1));
17 }
18
19 function $(id) {
20 return document.getElementById(id);
21 }
22
23 function init() {
24 var username = ReadCookie("username");
25 if(username && username.length>0) {
26 $("msg").innerHTML = "<h1>欢迎光临," + username + "!</h1>";
27 } else {
28 $("msg").innerHTML = "<a href='ex7.html'>请登录</a>";
29 }
30 }
31 </script>
32 </head>
33 <body onload="init()">
34 <div id="msg"></div>
35 </body>
36 </html>
2 <head>
3 <title>ex8</title>
4 <script type="text/javascript">
5 /***
6 *读取指定的Cookie值
7 *@param {string} cookieName Cookie名称
8 */
9 function ReadCookie(cookieName) {
10 var theCookie = "" + document.cookie;
11 var ind = theCookie.indexOf(cookieName);
12 if(ind==-1 || cookieName=="") return "";
13 var ind1 = theCookie.indexOf(';',ind);
14 if(ind1==-1) ind1 = theCookie.length;
15 /*读取Cookie值*/
16 return unescape(theCookie.substring(ind+cookieName.length+1,ind1));
17 }
18
19 function $(id) {
20 return document.getElementById(id);
21 }
22
23 function init() {
24 var username = ReadCookie("username");
25 if(username && username.length>0) {
26 $("msg").innerHTML = "<h1>欢迎光临," + username + "!</h1>";
27 } else {
28 $("msg").innerHTML = "<a href='ex7.html'>请登录</a>";
29 }
30 }
31 </script>
32 </head>
33 <body onload="init()">
34 <div id="msg"></div>
35 </body>
36 </html>