怎么在JavaScript中利用cookie保存用戶的登錄信息？很多新手對(duì)此不是很清楚，為了幫助大家解決這個(gè)難題，下面小編將為大家詳細(xì)講解，有這方面需求的人可以來學(xué)習(xí)下，希望你能有所收獲。

創(chuàng)新互聯(lián)主要從事網(wǎng)站制作、網(wǎng)站設(shè)計(jì)、網(wǎng)頁設(shè)計(jì)、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務(wù)。立足成都服務(wù)常山,10年網(wǎng)站建設(shè)經(jīng)驗(yàn),價(jià)格優(yōu)惠、服務(wù)專業(yè),歡迎來電咨詢建站服務(wù):028-86922220

通常cookie和session，是web開發(fā)中用于存儲(chǔ)信息的對(duì)象，session存在于服務(wù)器的內(nèi)存中，而cookie則是存在客戶端，所以js可以直接操作cookie進(jìn)行信息的存儲(chǔ)和讀取。

js存放cookie一般的寫法，如：document.cookie="userName=admin";，如果是多個(gè)鍵值對(duì)：document.cookie="userName=admin; userPass=123";

下面是js操作cookie保存用戶的登錄信息：

function addCookie(name,value,days,path){  /**添加設(shè)置cookie**/
  var name = escape(name);
  var value = escape(value);
  var expires = new Date();
  expires.setTime(expires.getTime() + days * 3600000 * 24);
  //path=/，表示cookie能在整個(gè)網(wǎng)站下使用，path=/temp，表示cookie只能在temp目錄下使用
  path = path == "" ? "" : ";path=" + path;
  //GMT(Greenwich Mean Time)是格林尼治平時(shí)，現(xiàn)在的標(biāo)準(zhǔn)時(shí)間，協(xié)調(diào)世界時(shí)是UTC
  //參數(shù)days只能是數(shù)字型
  var _expires = (typeof days) == "string" ? "" : ";expires=" + expires.toUTCString();
  document.cookie = name + "=" + value + _expires + path;
}
function getCookieValue(name){ /**獲取cookie的值，根據(jù)cookie的鍵獲取值**/
  //用處理字符串的方式查找到key對(duì)應(yīng)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值開始的位置起搜索第一個(gè)";"的位置,即cookie值結(jié)尾的位置
    if (end == -1) end = allcookies.length;    //如果end值為-1說明cookie列表里只有一個(gè)cookie
    var value = allcookies.substring(start,end); //提取cookie的值
    return (value);              //對(duì)它解碼
  }else{ //搜索失敗，返回空字符串
    return "";
  }
}
function deleteCookie(name,path){  /**根據(jù)cookie的鍵，刪除cookie，其實(shí)就是設(shè)置其失效**/
  var name = escape(name);
  var expires = new Date(0);
  path = path == "" ? "" : ";path=" + path;
  document.cookie = name + "="+ ";expires=" + expires.toUTCString() + path;
}
/**實(shí)現(xiàn)功能，保存用戶的登錄信息到cookie中。當(dāng)?shù)卿涰撁姹淮蜷_時(shí)，就查詢cookie**/
window.onload = function(){
  var userNameValue = getCookieValue("userName");
  document.getElementById("txtUserName").value = userNameValue;
  var userPassValue = getCookieValue("userPass");
  document.getElementById("txtUserPass").value = userPassValue;
}
function userLogin(){  /**用戶登錄，其中需要判斷是否選擇記住密碼**/
  //簡(jiǎn)單驗(yàn)證一下
  var userName = document.getElementById("txtUserName").value;
  if(userName == ''){
    alert("請(qǐng)輸入用戶名。");
    return;
  }
  var userPass = document.getElementById("txtUserPass").value;
  if(userPass == ''){
    alert("請(qǐng)輸入密碼。");
    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";
  }
}




  
    
      歡迎使用XXX管理系統(tǒng)
    
    
      
        用戶名：
      
      
        
      
    
    
      
        密 碼：
      
      
        
      
    
    
      
        是否記住密碼
        
      
    
    
      
        
        
      
    
  

看完上述內(nèi)容是否對(duì)您有幫助呢？如果還想對(duì)相關(guān)知識(shí)有進(jìn)一步的了解或閱讀更多相關(guān)文章，請(qǐng)關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝您對(duì)創(chuàng)新互聯(lián)的支持。