您的位置:首页 > Web前端 > JQuery

(jQuery)Cookie记住用户名和密码

2014-08-28 10:46 363 查看


转载▼


功能:勾选“记住用户名”,点击登录,保存cookie,下次登录不需输入;
不勾“记住用户名”,点击登录,不保存cookie,下次登录需输入;

jQuery代码:

<script src="js/jquery-1.3.1.js" type="text/javascript"></script> <!-- 引入引用jquery的库文件 -->

<script src="js/jquery.cookie.js" type="text/javascript"></script> <!-- 引入jQuery的cookie插件 -->

<script type="text/javascript">

//初始化页面时验证是否记住了密码

$(document).ready(function() {

if ($.cookie("rmbUser") == "true") {

$("#rmbUser").attr("checked", true);

$("#wsc-username").val($.cookie("userName"));

$("#wsc-password").val($.cookie("passWord"));

}

});

function saveUserInfo() {

if ($("#rmbUser").attr("checked") == true) {

var userName = $("#wsc-username").val();

var passWord = $("#wsc-password").val();

$.cookie("rmbUser", "true", { expires: 7 }); // 存储一个带7天期限的 cookie

$.cookie("userName", userName, { expires: 7 }); // 存储一个带7天期限的 cookie

$.cookie("passWord", passWord, { expires: 7 }); // 存储一个带7天期限的 cookie

}

else {

$.cookie("rmbUser", "false", { expires: -1 }); // 删除 cookie

$.cookie("userName", '', { expires: -1 });

$.cookie("passWord", '', { expires: -1 });

}

}

</script>

HTML代码:

<body>

<form action="" method="post">

<div class="form">

<div id="J_UserName" class="loginItem">

<label>用户名:</label>

<input maxlength="200" value="" name="u_username" class="log_Field" id="wsc-username">

</div>

<div class="loginItem" id="J_Password">

<label>密  码:</label>

<input type="password" value="" maxlength="20" name="u_pwd" class="log_Field" id="wsc-password">

</div>

<div class="loginRemember">

<input type="checkbox" checked="true" name="chkRememberUsername" class="checkbox" id="rmbUser">

<label for="rmbUser">记住用户名</label>

<a href="#">忘记密码?</a>

</div>

<div class="loginItem loginButton" id="wait">

<input type="submit" value="登录" onclick="saveUserInfo()" class="button" id="log_Commit">

</div>

</div><!--form div-->

</form>

-------------------------------------------------------------------------------------
下面是jquery.cookie.js用法

$.cookie('the_cookie'); // 获得cookie

$.cookie('the_cookie', 'the_value'); // 设置cookie

$.cookie('the_cookie', 'the_value', { expires: 7 }); //设置带时间的cookie

$.cookie('the_cookie', '', { expires: -1 }); // 删除

$.cookie('the_cookie', null); // 删除 cookie
$.cookie('the_cookie', 'the_value', {expires: 7, path: '/', domain: 'jquery.com',
secure: true});//新建一个cookie 包括有效期 路径 域名等

【代码表示在前人基础上整理】
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: