jsjqueryhtml5 设置cookie方法

<html >
<head>
	<title></title>

    <script src="js/jquery-1.9.1.js" type="text/javascript"></script>
    <script src="js/jquery.cookie.js" type="text/javascript"></script>
	</script>
	<script type="text/javascript">
		jQuery().ready(function(){
			var url ='https://www.google.com.hk/webhp?client=aff-cs-360se-channel&channel=bookmark&gws_rd=ssl';
			
			jQuery("input:button").click(function(){
				var $checkbox = jQuery("input:checkbox");
				if($checkbox.eq(0).is(":checked")){
					localStorage.name= jQuery("input:text").val();
					localStorage.pwd = jQuery("input:password").val();
					window.location.href=url;
				}
				if($checkbox.eq(1).is(":checked")){
					//localStorage.name='';
					//localStorage.pwd='';
					localStorage.clear();
				}
				if($checkbox.eq(2).is(":checked")){
					sessionStorage.name=jQuery("input:text").val();
					sessionStorage.pwd=jQuery("input:password").val();
					window.location.href=url;
				}
				if($checkbox.eq(3).is(":checked")){
					sessionStorage.clear();
				}
				if($checkbox.eq(4).is(":checkbox")){
					jQuery.cookie("name",jQuery("input:text").val(),{expires:7,path:'/'});
					$.cookie("pwd",jQuery("input:password").val(),{expires:7,path:'/'});
					window.location.href=url;
				}
				if($checkbox.eq(5).is(":checked")){
					$.cookie("name",'',{expires:-1,path:'/'});
					$.cookie("pwd",'',{expires:-1,path:'/'});
				}
			});

			function init(){
				if(localStorage.name){
					jQuery("input:text").val(localStorage.name);
					jQuery("input:password").val(localStorage.pwd);
				}
				if(sessionStorage.name){
					jQuery("input:text").val(sessionStorage.name);
					jQuery("input:text").val(sessionStorage.pwd);
				}
				
				if($.cookie('name')){
					jQuery("input:text").val($.cookie("name"));
					jQuery("input:text").val($.cookie("pwd"));
				}
			};
			init();
		});
	</script>
</head>
<body>
<form id='form' action="#">
	<input type="text" name='name' id='name'><br>
	<input type="password" name='pwd' id='pwd'><br>
	<input type="checkbox" >记住密码[localStorage]--关闭浏览器有效<br>
	<input type="checkbox" >删除记忆密码[localStorage]<br>
	<input type="checkbox" >记住密码[sessionStorage]关闭浏览器无效<br>
	<input type="checkbox" >删除记忆密码[sessionStorage]<br>
	<input type="checkbox" >记住密码[jquery.cookie]<br>
	<input type="checkbox" >删除记忆密码[jquery.cookie]<br>
	<input type='button' value='good' >
</form>
</body>
</html>

2

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script language="javascript" type="text/javascript">
function addCookie(name,value,days,path){	/**添加设置cookie**/
	var name = escape(name);
    var value = escape(value);
    var expires = new Date();
	expires.setTime(expires.getTime() + days * 3600000 * 24);
	//path=/,表示cookie能在整个网站下使用,path=/temp,表示cookie只能在temp目录下使用
	path = path == "" ? "" : ";path=" + path;
	//GMT(Greenwich Mean Time)是格林尼治平时,现在的标准时间,协调世界时是UTC
	//参数days只能是数字型
	var _expires = (typeof days) == "string" ? "" : ";expires=" + expires.toUTCString();
	document.cookie = name + "=" + value + _expires + path;
}
function getCookieValue(name){	/**获取cookie的值,根据cookie的键获取值**/
	//用处理字符串的方式查找到key对应value
	var name = escape(name);
    //读cookie属性,这将返回文档的所有cookie
    var allcookies = document.cookie;       
    //查找名为name的cookie的开始位置
	name += "=";
    var pos = allcookies.indexOf(name);    
    //如果找到了具有该名字的cookie,那么提取并使用它的值
    if (pos != -1){                                             //如果pos值为-1则说明搜索"version="失败
		var start = pos + name.length;                  //cookie值开始的位置
        var end = allcookies.indexOf(";",start);        //从cookie值开始的位置起搜索第一个";"的位置,即cookie值结尾的位置
        if (end == -1) end = allcookies.length;        //如果end值为-1说明cookie列表里只有一个cookie
        var value = allcookies.substring(start,end); //提取cookie的值
        return (value);                           //对它解码      
	}else{	//搜索失败,返回空字符串
		return "";
	}
}
function deleteCookie(name,path){	/**根据cookie的键,删除cookie,其实就是设置其失效**/
    var name = escape(name);
    var expires = new Date(0);
	path = path == "" ? "" : ";path=" + path;
	document.cookie = name + "="+ ";expires=" + expires.toUTCString() + path;
}

/**实现功能,保存用户的登录信息到cookie中。当登录页面被打开时,就查询cookie**/
window.onload = function(){
	var userNameValue = getCookieValue("userName");
	document.getElementById("txtUserName").value = userNameValue;
    var userPassValue = getCookieValue("userPass");
	document.getElementById("txtUserPass").value = userPassValue;
}

function userLogin(){	/**用户登录,其中需要判断是否选择记住密码**/
	//简单验证一下
	var userName = document.getElementById("txtUserName").value;
	if(userName == ''){
		alert("请输入用户名。");
		return;
	}
	var userPass = document.getElementById("txtUserPass").value;
	if(userPass == ''){
		alert("请输入密码。");
		return;
	}
	var objChk = document.getElementById("chkRememberPass");
	if(objChk.checked){
		//添加cookie
		addCookie("userName",userName,7,"/");
		addCookie("userPass",userPass,7,"/");
		alert("记住了你的密码登录。");
		window.location.href = "http://www.baidu.com";
	}else{
		alert("不记密码登录。");
		window.location.href = "http://www.baidu.com";
	}
}
</script>
</head>
<body>
<center>
	<table width="400px" height="180px" cellpadding="0" cellspacing="0" border="1" style="margin-top:100px;">
    	<tr>
        	<td align="center" colspan="2">欢迎使用XXX管理系统</td>
        </tr>
        <tr>
        	<td align="right">
            	<label>用户名:</label>
            </td>
            <td align="left">
            	<input type="text" id="txtUserName" name="txtUserName" style="width:160px; margin-left:10px;" />
            </td>
        </tr>
        <tr>
        	<td align="right">
            	<label>密  码:</label>
            </td>
            <td align="left">
            	<input type="password" id="txtUserPass" name="txtUserPass" style="width:160px; margin-left:10px;" />
            </td>
        </tr>
        <tr>
        	<td align="center" colspan="2">
            	<span style="font-size:12px; color:blue; vertical-align:middle;">是否记住密码</span>
            	<input type="checkbox" id="chkRememberPass" name="chkRememberPass" style="vertical-align:middle;" />
            </td>
        </tr>
        <tr>
        	<td align="center" colspan="2">
            	<input type="submit" id="subLogin" name="subLogin" value="登 录" οnclick="userLogin()"/>
                    
            	<input type="reset" id="resetLogin" name="resetLogin" value="重 置" />
            </td>
        </tr>
    </table>
</center>
</body>
</html>

3


<html xmlns="http://www.w3.org/1999/xhtml">
    <head >
    <title></title>
    <script src="js/jquery-1.4.2.min.js" type="text/javascript"></script>
    <script src="js/jquery.cookie.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            //绑定addCookie的时间
            $("#addCookie").bind("click", function () {
                addCookie();
            })
            //查看cookie的值
            $("#ReadCookie").bind("click", function () {
                ReadCookie();
            })
            //删除cookie的值
            $("#delCookie").bind("click", function () {
                delCookie();
            })
        })
        function addCookie() {//增加Cookie
            $.cookie('firstCookie', $("#inputValue").val());
        }
        function delCookie() {//删除Cookie
            alert($.removeCookie('firstCookie'));
        }

        function ReadCookie() {//查看Cookie
            $("#inputValue").val($.cookie('firstCookie')); //将cookie值附加到文本框
            alert('cookie的值:' + $.cookie('firstCookie'));
        }
        if($.cookie('firstCookie')){
            alert("good");
        }
        if($.cookie('name')){
            jQuery("input:text").val($.cookie("name"));
            jQuery("input:text").val($.cookie("pwd"));
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <div>
            <input type="button" id="addCookie" name="name" value="增加/修改" />
            <input type="text" id="inputValue" name="name" value=" " /></div>
        <div>
            <input type="button" id="delCookie" name="name" value="删除" />
            <input type="button" id="ReadCookie" name="name" value="读取" />
        </div>
    </div>
    </form>
</body>
</html>

4

<html>
<head>
<script type="text/javascript">
function getCookie(c_name)
{
if (document.cookie.length>0)
  {
  c_start=document.cookie.indexOf(c_name + "=")
  if (c_start!=-1)
    { 
    c_start=c_start + c_name.length+1 
    c_end=document.cookie.indexOf(";",c_start)
    if (c_end==-1) c_end=document.cookie.length
    return unescape(document.cookie.substring(c_start,c_end))
    } 
  }
return ""
}

function setCookie(c_name,value,expiredays)
{
var exdate=new Date()
exdate.setDate(exdate.getDate()+expiredays)
document.cookie=c_name+ "=" +escape(value)+
((expiredays==null) ? "" : ";expires="+exdate.toGMTString())
}

function checkCookie()
{
username=getCookie('username')
if (username!=null && username!="")
  {alert('Welcome again '+username+'!')}
else 
  {
  username=prompt('Please enter your name:',"")
  if (username!=null && username!="")
    {
    setCookie('username',username,365)
    }
  }
}
</script>
</head>

<body onLoad="checkCookie()">
</body>
</html>



评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值