通过jquery实现记住用户名密码

本文简要介绍了在网站开发中记住用户名、密码的实现方式，是通过jquery实现的。

一 引用jquery库文件

<script type="text/javascript" src="/View/JS/JQuery.js"></script>

<script type="text/javascript" src="/View/JS/jquery.cookie.js"></script>

二 需要的js函数

//初始化页面时验证是否记住了用户信息

function cheLogSta()

{

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

{

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

$("#txUser").val($.cookie("userName"));

$("#txPWD").val($.cookie("passWord"));

}

}

//保存用户信息

function saveUserInfo()

{

if ($("#rmbUser").attr("checked"))

{

var userName = $("#txUser").val();

var passWord = $("#txPWD").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("userName", '', { expires: -1 });

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

}

}

三 HTML元素

<div id="login">

<div style = "margin-top:10px;text-align:center">

<span>用户：</span><div style = "display:inline;"><input type="text" id="txUser" maxlength="16"/></div>

</div>

<div style = "margin-top:10px;text-align:center">

<span>密码：</span><div style = "display:inline;"><input type="password" id="txPWD" maxlength="16"/></div>

</div>

<div style = "margin-top:10px;margin-left:45px;">

<div><input type="checkbox" id="rmbUser"/>保存用户信息</div>

</div>

</div>