localStorage實現登錄注冊功能

HTML5 提供了兩種在客戶端存儲數據的新方法：

• localStorage：生命周期是永久，這意味着除非用戶顯示在瀏覽器提供的UI上清除localStorage信息，否則這些信息將永遠存在。存放數據大小為一般為5MB,而且它僅在客戶端（即瀏覽器）中保存，不參與和服務器的通信。
• sessionStorage ：僅在當前會話下有效，關閉頁面或瀏覽器后被清除。存放數據大小為一般為5MB,而且它僅在客戶端（即瀏覽器）中保存，不參與和服務器的通信。源生接口可以接受，亦可再次封裝來對Object和Array有更好的支持。

登錄效果：JS代碼

//先獲取所有用戶的對象//變成數組    
if(window.localStorage.userArr){
    //判斷是否存在        
    var array = JSON.parse(window.localStorage.userArr);    
}else{        
    array = [];//創建一個新數組    
}

$("#login").bind("click",function(){
    var username = $uname.val();        
    var password = $upwd.val();    
    var flag = false;
    var index = 0;
    //遍歷數組進行匹配        
    for(var i =0;i<array.length;i++){            
        //判斷是否有相同賬號            
        if(username==array[i].username){//有這個賬號                
            flag = true;                
            index = i;        
        }
    }
    if(flag){//如果存在            
        if(password==array[index].password){                
            alert("登錄成功");
            var yonghu = $uname;
            localStorage.name = yonghu.val();
            console.log(localStorage.name);
            window.location.href="../html/index.html";
        }else{                
            alert("密碼錯誤");            
        }        
    }else{//賬號不存在或輸入錯誤            
        $erroinfo.show().find("b").html("用戶不存在，請先注冊");
        
    }    

})

注冊效果：JS代碼

//先獲取所有用戶的對象//變成數組    
if(window.localStorage.userArr){
    //判斷是否存在        
    var array = JSON.parse(window.localStorage.userArr);    
}else{        
    array = [];//創建一個新數組    
}

$ok.bind("click",function(){
    var username = $uname.val();        
    var password = $upwd.val();    
    //遍歷數組進行匹配        
    for(var i =0;i<array.length;i++){            
        //判斷是否有相同賬號            
        if(username==array[i].username){                
            alert("該賬號已存在");
            window.location.href="../html/login.html";
            return;            
        }        
    }
    //創建對象        
    var obj = {
        username:username,password:password
    }
    array.push(obj);        
    window.localStorage.userArr=JSON.stringify(array);    
    alert("用戶創建成功");    
    window.location.href="../html/login.html"; 
})

希望能給你提供一些參考~