javascript如何操作cookie来实现用户登录代码实例详解_js 根据cookie显示注册登录按钮-程序员宅基地

很多登录功能上都有个“记住密码”的功能,其实无非就是对cookie的读取。

下面展示这个功能的代码,测试方法:直接输入账号密码,提交后,刷新页面,再输入同样的账号,就可以显示

下面是login.jsp

<input type="text" id="username" class="input t1" placeholder="用户名或手机号">
<input type="password" id="password" class="input t2" placeholder="密码">
<div class="checkbox"><label><input id="jz" type="checkbox">记住密码</label></div>
<div class="login_btn"><input type="button" onclick="login()" class="btn" value="登 录"></div>

下面是login.js 

/*
*初始化调用
*/
$(function(){
	GetLastUser();
});

/*
*登录
*/
function login(){
	/*业务代码省略*/
    SetPwdAndChk();
}

/*
*从cookie中获取用户名及密码
*/
function GetLastUser() {
    var id = "49BAC005-7D5B-4231-8CEA-16939BEACD67";//GUID标识符
    var usr = GetCookie(id);
    if (usr != null) {
      document.getElementById('username').value = usr;
    } else {
      document.getElementById('password').value = "001";
    }
    GetPwdAndChk();
  }

/*
*点击登录时触发客户端事件
*/
function SetPwdAndChk() {
    //取用户名
    var usr = $.trim($('#username').val());
    //alert(usr);
    //将最后一个用户信息写入到Cookie
    SetLastUser(usr);
    //如果记住密码选项被选中
    if (document.getElementById('jz').checked == true) {
        //取密码值
        var pwd = $.trim($('#password').val());
        //alert(pwd);
        var expdate = new Date();
        expdate.setTime(expdate.getTime() + 14 * (24 * 60 * 60 * 1000));
        //将用户名和密码写入到Cookie
        SetCookie(usr, pwd, expdate);
    } else {
        //如果没有选中记住密码,则立即过期
        ResetCookie();
    }
}

function SetLastUser(usr) {
    var id = "49BAC005-7D5B-4231-8CEA-16939BEACD67";
    var expdate = new Date();
    //当前时间加上两周的时间
    expdate.setTime(expdate.getTime() + 14 * (24 * 60 * 60 * 1000));
    SetCookie(id, usr, expdate);
}

//用户名失去焦点时调用该方法
function GetPwdAndChk() {
    var usr = $.trim($('#username').val());
    var pwd = GetCookie(usr);
    if (pwd != null) {
        document.getElementById('jz').checked = true;
        document.getElementById('password').value = pwd;
    } else {
        document.getElementById('jz').checked = false;
        document.getElementById('password').value = "";
    }
}

//取Cookie的值
function GetCookie(name) {
    var arg = name + "=";
    var alen = arg.length;
    var clen = document.cookie.length;
    var i = 0;
    while (i < clen) {
        var j = i + alen;
        if (document.cookie.substring(i, j) == arg) return getCookieVal(j);
        i = document.cookie.indexOf(" ", i) + 1;
        if (i == 0) break;
    }
    return null;
}

function getCookieVal(offset) {
    var endstr = document.cookie.indexOf(";", offset);
    if (endstr == -1) endstr = document.cookie.length;
    return unescape(document.cookie.substring(offset, endstr));
}

//写入到Cookie
function SetCookie(name, value, expires) {
    var argv = SetCookie.arguments;
    //本例中length = 3
    var argc = SetCookie.arguments.length;
    var expires = (argc > 2) ? argv[2] : null;
    var path = (argc > 3) ? argv[3] : null;
    var domain = (argc > 4) ? argv[4] : null;
    var secure = (argc > 5) ? argv[5] : false;
    document.cookie = name + "=" + escape(value) + ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + ((path == null) ? "" : ("; path=" + path)) + ((domain == null) ? "" : ("; domain=" + domain)) + ((secure == true) ? "; secure" : "");
}

function ResetCookie() {
    var usr = $.trim($('#username').val());
    var expdate = new Date();
    SetCookie(usr, null, expdate);
}

 

 

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/CSDN_920227/article/details/103369605

智能推荐

使用POI将mysql数据表转成excel电子表_myd文件转excel-程序员宅基地

文章浏览阅读1.8k次。Apache Jakarta POI项目提供了用于访问和生成Excel文档的组件。POI HSSF API用于生成Excel Workbook以及将Excel电子表格添加到workbook。Excel电子表格由行和单元格组成。电子表格的页面布局和字体也使用POI HSSF API进行设置。      通常要求将数据库表呈现在Excel电子表格中。同样,开发人员的需求也可以保存到数据库表中的_myd文件转excel

在CentOS 5.6安�Ruby及Redmine_linux使用rz命令出现b010000-程序员宅基地

文章浏览阅读5.2k次。又是因�工作需要,突然需要碰Redmine�套�案管理系�,但是可以�用的主�已�使用了CentOS,所以我必�在CentOS上安�Ruby等相�Redmine所需的相���。安�前你必�先:安�好MySQLMySQL可以新增�料��正常�作中有root�限 步�上大致有:安�Ruby安�RubyGems下�Redmine安�Bundler�定Redmine在C_linux使用rz命令出现b010000

Android & Kotlin:通过实现画板App学习onTouchEvent_kotlin ontouchevent-程序员宅基地

文章浏览阅读1.1k次。之前几个例子中经常使用到onClick,今天学习一下onTouchEvent。onTouchEvent和onClick是不同的事件,click只是点击一次,onTouchEvent是观察整个touch过程。0.效果展示1. 布局1.1 RelativeLayout之前都是使用LinearLayout进行布局,还有一种布局使用也挺多的:RelativeLayout,可以通过相对定位的方式让控件出现在布局的任何位置。通过描述跟父组建或是其他组建关系进行布局,如下为布局使用设置:layout_kotlin ontouchevent

ios远程证书的制作_applesev远程证明-程序员宅基地

文章浏览阅读381次。在ios中,通知有两种(提醒轰炸的来源): 第一种是本地通知(UILocalNotification),这一种不需要申请推送证书,也不需要向程序注册,直接使用,这一种不是本文讨论的范围。 第二种是APNS远程推送——远程通知(UIRemoteNotification),这个不仅需要向程序注册,也需要在开发者账号里申请推送证书,下面来介绍一下如何注册和申请证书。一_applesev远程证明

jdk从1.8换成1.7后,查看版本还是1.8解决方法-程序员宅基地

文章浏览阅读253次。因学习需要,需将jdk从1.8更改到1.7,其中遇到了些小麻烦,如果你也遇到这种麻烦,可以借鉴一下我的解决方法。1、jdk的安装及环境变量的配置,详见https://jingyan.baidu.com/article/6dad5075d1dc40a123e36ea3.html2、具体更改步骤:将JAVA_HOME:的路径更改为1.7的相关路径,例如我的:C:\Program Fil..._linux安装jdk8没问题安装17改了环境变量看还是8

linux内核err实现,Linux中IS_ERR()函数的理解-程序员宅基地

文章浏览阅读876次。在Linux源码中的fs部分,经常会碰到这样的函数(位于kernel/include/linux/fs.h):/** Kernel pointers have redundant information, so we can use a* scheme where we can return either an error code or a dentry* pointer with the sa..._linux is_err函数

随便推点

机器学习-深度学习资料合集_机器学习guolih-程序员宅基地

文章浏览阅读384次。比较全面的收集了机器学习的介绍文章,从感知机、神经网络、决策树、SVM、Adaboost到随机森林、Deep Learning。《机器学习经典论文/survey合集》介绍:看题目你已经知道了是什么内容,没错。里面有很多经典的机器学习论文值得仔细与反复的阅读。《Brief History of Machine Learning》2介绍:这是一篇介绍机器学习历史的文章,介绍_机器学习guolih

python电影评价分析.dat_python读DAT - IT屋-程序员软件开发技术分享社区-程序员宅基地

文章浏览阅读176次。如果文件存在或者不存在,将文件打开为读/写的最佳方式是什么?然后创建并以读/写方式打开文件?从我读的, file = open('myfile.dat','rw')应该这样做,对吧? 它不适用于我(Python 2.6.2),我想知道它是否是一个版本问题,或不应该像这样或那样工作。 $ b $ p 更新:封闭的目录可以被用户和组写入,而不是其他(我在Linux系统上...所以权限779322017..._st = time.time() print("开始转化电影的dat文件")

基于springboot实现图书馆管理系统项目【项目源码+论文说明】计算机毕业设计_springboot图书管理系统免费源码-程序员宅基地

文章浏览阅读632次,点赞9次,收藏5次。通过互联网的发展和使用,让更多的人,更多的用户可以通过电子计算机信息技术就能更加方便地进行管理。为了能更好的管理图书馆,维护图书馆体系的正常运行,制作一个用于图书馆座位管理的系统,实现在线图书借阅、在线的自习座位预约等功能,后台用户可以对图书馆的图书馆员工进行管理,对图书存取进行管理,减免了繁琐的手工记录过程,提高管理效率,优化管理模式。如今信息化社会的不断发展,让更多的,注重人们的生活品质的提高,在生活的同时,也越来越注重在以后的生活中的服务,拥有良好的图书馆,能够让用户在很大的程度上体验生活。_springboot图书管理系统免费源码

网康应用安全网关(NS-ASG)-list_ipAddressPolicy-SQL注入漏洞(CVE-2024-2022)复现_网康ns-asg应用安全网关-程序员宅基地

文章浏览阅读413次,点赞7次,收藏6次。攻击者可以通过构造恶意的SQL语句,成功注入并执行恶意数据库操作,可能导致敏感信息泄露、数据库被篡改或其他严重后果。网康应用安全网关(NS-ASG) list_ipAddressPolicy 接口存在SQL注入漏洞。网康应用安全网关(NS-ASG)-list_ipAddressPolicy-SQL注入漏洞。FOFA:app="网康-NS-ASG-应用安全网关"网康应用安全网关(NS-ASG)漏洞类别: SQL注入漏洞。_网康ns-asg应用安全网关

focusky html怎么转ppt,Focusky怎么转PPT_Focusky如何导入PPT_Focusky教程-程序员宅基地

文章浏览阅读940次。Focusky如何导入PPT Focusky导入PPT教程方法/步骤首先对于我们来说,电脑上面必须安装上有focusky动画演示大师这个软件,如果没有安装的话,那么可以看小编的另外一篇文章哟,这里我们打开我们的focusky动画演示大师。然后在主界面可以看到有一个导入PPT的选择项,这里我们就点击这个选项。然后我们就是打开文件了,这里我们直接找到我们的PPT文件,然后选择好我们的PPT文件之后,我..._focusky课件怎么转换成ppt

CAN驱动代码-程序员宅基地

文章浏览阅读4k次。#include "can.h"#include "led.h"#include "delay.h"#include "usart.h"////////////////////////////////////////////////////////////////////////////////// //CAN驱动代码 //////////////////_can驱动代码