通過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>