在登录界面添加记住密码功能,代码如下:

//设置cookie
var passKey = '4c05c54d952b11e691d76c0b843ea7f9';
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var expires = "expires="+d.toUTCString();
document.cookie = cname + "=" + encrypt(escape(cvalue), passKey) + "; " + expires;
}
//获取cookie
function getCookie(cname) {
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1);
if (c.indexOf(name) != -1){
var cnameValue = unescape(c.substring(name.length, c.length));
return decrypt(cnameValue, passKey);
}
}
return "";
}
//清除cookie
function clearCookie(cname) {
setCookie(cname, "", -1);
}

setCookie(cname, cvalue, exdays)三个参数分别是存放的cookie名字、cookie值、cookie有效天数

由于cookie中不能包含等号、空格、分号等特殊字符,我在设置cookie时使用escape() 函数对字符串进行编码,获取cookie时使用unescape()函数解码。但是escape()函数不会对 ASCII 字母和数字进行编码,所以存放到cookie中的账号、密码是以明文存放的,不安全。于是上网找了一个对字符串加密解密算法,该算法需要传两个参数,一个需要加密的字符串,一个自定义加密密钥passKey。设置cookie时使用encrypt(value, passkey)加密,读取cookie时使用decrypt(value, passKey)解密,该算法附在本文最后。

存取cookie方法的调用:

<input type="checkbox" id="rememberMe" checked="checked"/>记住密码

存入cookie

  • 判断帐号密码无误后将用户名密码存入cookie
if($('#rememberMe').is(':checked')){
setCookie('customername', $('#username').val().trim(), 7)
setCookie('customerpass', $('#password').val().trim(), 7)
}

自动填充

  • 进入登录界面后,判断cookie中是否有帐号密码,如果有就自动填充
$(function(){

  //获取cookie
var cusername = getCookie('customername');
var cpassword = getCookie('customerpass');
if(cusername != "" && cpassword != ""){
$("#username").val(cusername);
$("#password").val(cpassword);
}
}

js中利用cookie实现记住密码功能的更多相关文章

  1. 【原创】js中利用cookie实现记住密码功能

    在登录界面添加记住密码功能,我首先想到的是在java后台中调用cookie存放账号密码,大致如下: HttpServletRequest request HttpServletResponse res ...

  2. jquery.cookie.js 操作cookie实现记住密码功能的实现代码

    jquery.cookie.js操作cookie实现记住密码功能,很简单很强大,喜欢的朋友可以参考下.   复制代码代码如下: //初始化页面时验证是否记住了密码 $(document).ready( ...

  3. cookie实现记住密码功能

    之前在一次面试过程中,被问到前后端如何实现记住密码功能,所以自己也试着做,这是纯js做的. 一.实现思路 1.前端页面,自己简单写了一个页面,如下图,不喜勿喷 2.主要有三个函数 setCookie( ...

  4. node.js平台下,利用cookie实现记住密码登陆(Express+Ejs+Mysql)

    本博文需有node.js+express+mysql入门基础,若基础薄弱,可参考博主的其他几篇node.就是博文: 1.下载Mysql数据库,安装并配置 创建用户表供登录使用: 2.node.js平台 ...

  5. js中记住密码功能

    js中记住密码功能(在前端实现) 直接上例子(如果你也要实现的话注意改一些变量名称,jsp代码不包含样式) Jsp代码: <form class="am-form tpl-form-l ...

  6. java实现记住密码功能(利用cookie)

    <br> <input type="text" id="userName" name="userName" value=& ...

  7. 记住密码功能 JS结合JQuery 操作 Cookie 实现记住密码和用户名!

    // 记住密码功能 JS结合JQuery 操作 Cookie 实现记住密码和用户名! var username = document.getElementById("username&quo ...

  8. cookie记住密码功能

    很多门户网站都提供了记住密码功能,虽然现在的浏览器都已经提供了相应的记住密码功能 效果就是你每次进入登录页面后就不需要再进行用户名和密码的输入: 记住密码功能基本都是使用cookie来进行实现的,因此 ...

  9. JavaScript实现记住密码功能

    用js实现记住密码功能,但是前端记住密码不安全,最好还是不要用.我感觉这个记住密码应该是通过与后台建立一个会话来实现. 这个效果的测试地址在:http://ofoyou.com/blog/rePass ...

随机推荐

  1. dwr的ScriptSession和HttpSession分析

    1.关于ScriptSession ScriptSession不会与HttpSession同时创建 当我们访问一个页面的时候,如果是第一次访问,会创建一个新的HttpSession,之后再访问的时候, ...

  2. 【环境配置】配置jdk

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/manoel/article/details/37736569 1. 下载jdk的安装文件 http: ...

  3. 并发编程---开启进程方式---查看进程pid

    1.开启进程的两种方式 方式一: from multiprocessing import Process import time def task(name): print('%s is runnin ...

  4. 【SVM、决策树、adaboost、LR对比】

    一.SVM 1.应用场景: 文本和图像分类. 2.优点: 分类效果好:有效处理高维空间的数据:无局部最小值问题:不易过拟合(模型中含有L2正则项): 3.缺点: 样本数据量较大需要较长训练时间:噪声不 ...

  5. 万恶之源 - Python 自定义模块

    自定义模块 我们今天来学习一下自定义模块(也就是私人订制),我们要自定义模块,首先就要知道什么是模块啊 一个函数封装一个功能,比如现在有一个软件,不可能将所有程序都写入一个文件,所以咱们应该分文件,组 ...

  6. Hive和SparkSQL:基于 Hadoop 的数据仓库工具

    Hive 前言 Hive 是基于 Hadoop 的一个数据仓库工具,可以将结构化的数据文件映射为一张数据库表,并提供完整的 SQL 查询功能,将类 SQL 语句转换为 MapReduce 任务执行. ...

  7. (转)JVM内存分配 -Xms128m -Xmx512m -XX:PermSize=128m -XX:MaxPermSize=512m

    在linux环境下配置项目运行环境时,部署的人员都会分配一下内存,以保证程序正常的运行.其实在开发的时候(window系统),就已经涉及到内存分配了,只是这些参数有默认值,因此一直没有去重视它. 以M ...

  8. 【LeetCode每天一题】Divide Two Integers(两整数相除)

    Given two integers dividend and divisor, divide two integers without using multiplication, division ...

  9. [Java in NetBeans] Lesson 08. If: conditional statement

    这个课程的参考视频和图片来自youtube. 主要学到的知识点有: 1. If-else statement if (x > 5) { System.out.println("Inpu ...

  10. Sqlserver2008R2配置数据库镜像之我的经验总结

    一. 相关环境介结. 数据库:Sqlserver2008R2    网络环境:主机.镜像机(阿里云,青岛节点同域),见证机(本公司自己托管在上海) 二. 服务器相关配置. 1. 分别开启三台服务器50 ...