(jQuery)使用cookie實現在客戶端保存賬號和密碼


HTML頁面

<input class="u-input" type="text" placeholder="用戶賬號" id="username" />

<input class="u-pass" type="password" id="password" />

<input type="checkbox" onclick="save()" id="ck_rmbUser"/>記住賬號

<button class="login"  onclick="loginclick()">登錄</button>

引入cookie插件

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

實現方法

<script type="text/javascript">
 $(document).ready(function() {
  if ($.cookie("rmbUser") == "true") {
   $("#ck_rmbUser").attr("checked", true);
   $("#username").val($.cookie("username"));
   $("#password").val();
   $("#password").val($.cookie("password"));
  }
 });
</script>

//記住用戶名密碼
<script type="text/javascript">
 function save() {
  if ($("input[type='checkbox']").is(':checked')) {
   var username = $("#username").val();
   var password = $("#password").val();
   $.cookie("rmbUser", "true", {
    expires : 7
   }); //存儲一個帶7天期限的cookie
   $.cookie("username", username, {
    expires : 7
   });
   $.cookie("password", password, {
    expires : 7
   });
  } else {
   $.cookie("rmbUser", "false", {
    expire : -1
   });
   $.cookie("username", "", {
    expires : -1
   });
   $.cookie("password", "", {
    expires : -1
   });
  }
 };

//登錄方法
 function loginclick() {
  if ($("#username").val() == null || $("#username").val() == "") {
   alert("用戶名不能為空!")
  }
  if ($("#password").val() == null || $("#password").val() == "") {
   alert("密碼不能為空!")
  }
  $.ajax({
   url : "index/login",
   type : "post",
   data : {
    login_name : $("#username").val().trim(),
    login_password : $("#password").val().trim(),
    verify_code : $("#u-ver").val().trim()
   },
   dataType : "json",
   contentType : "application/x-www-form-urlencoded;charset=utf-8",
   success : function(data) {
    //data為jeson對象,判斷code值,0登陸成功1,登陸失敗
    if (data.login_code == "0") {
     //登陸成功后跳轉到主頁面
     window.location.href = "main.html";
    } else {
     //登陸密碼錯誤后清空密碼框
     document.getElementById("password").value = "";
     alert(data.login_result);
    }
   }
  });
 }
</script>


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM