JSP表单页面
<form action="login" method="post">
用户名:<input type="text" name="username" id="username" /><br>
密码:<input type="password" name="password" /><br />
<input type="checkbox" id="remember" checked="checked">
记住用户名<input type="submit" value="登录" id="sub" />
</form>
JS操作cookie
<script type="text/javascript">
$(document).ready(function() {
var name = getCookie("username");
//$("#username")[0].value=name;
$("#username").val(name);
/*
* 当点击登录按钮时 判断是否勾选记住用户名
* 如果勾选 则将用户名保存在Cookie中 否则删除
*/
$("#sub").click(function() {
if ($("#remember").attr("checked") == true) {
//获得用户名
var username = $("#username").val();
//设置cookie
setCookie("username", username);
} else {
//删除cookie
delCookie("username")
}
})
function setCookie(name, value) {
var Days = 60; //cookie 将被保存两个月
var exp = new Date(); //获得当前时间
exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 1000); //换成毫秒
document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString();
}
function getCookie(name) {
//取出cookie
var strCookie = document.cookie;
//cookie的保存格式是 分号加空格 "; "
var arrCookie = strCookie.split("; ");
for ( var i = 0; i < arrCookie.length; i++) {
var arr = arrCookie[i].split("=");
if (arr[0] == "username") {
return arr[1];
}
}
return "";
}
function delCookie(name) {
var exp = new Date(); //当前时间
exp.setTime(exp.getTime() - 1); //删除cookie 只需将cookie设置为过去的时间
var cval = getCookie(name);
if (cval != null)
document.cookie = name + "=" + cval + ";expires="+ exp.toGMTString();
}
})
</script>
cookie简单介绍
cookie是浏览器提供的一种机制,它将document对象的cookie属性提供给javascript。可以由javascript对起进行控制
而并不是javascript本身的性质。cookie是存于用户硬盘的一个文件,这个文件通常对应于一个域名,当浏览器再次
访问这个域名时,便使这个cookie可用。因此,cookie可以跨越一个域名下的多个网页,但不能跨越多个域名使用。
cookie机制将信息存储于用户硬盘,因此可以作为全局变量,这是它最大的一个优点。它可以用于以下几种场合。
(1) 保存用户登录状态
(2) 跟踪用户行为
(3) 定制页面
(4) 创建购物车
设置cookie
每个cookie都是一个名/值对,可以把下面这样一个字符串赋值给document.cookie
document.cookie="username=zhangsan";
如果要一次存储多个名/值对,可以使用分号加空格(; )隔开,例如:
document.cookie="username=zhangsan; password=123";
在cookie 的名或值中不能使用分号(;)、逗号(,)、等号(=)以及空格。在cookie的名中做到这点很容易,但要保存的值是不确定的。如何来存储这些值呢?方 法是用escape()函数进行编码,它能将一些特殊符号使用十六进制表示,例如空格将会编码为“20%”,从而可以存储于cookie值中,而且使用此 种方案还可以避免中文乱码的出现。
给cookie设置终止日期
到现在为止,所以的cookie都是单会话cookie,即浏览器关闭后这些cookie将会丢失。
在实际开发中,cookie常常需要长期保持,例如保存用户登录的状态,可以用下面的选项来实现:
document.cookie="username=zhangsan; expiress=GMT_String";
其中GMT_String是以GMT格式表示的时间字符串,这条语句就是将username这个cookie设置为GMT_String
表示的过期时间,超过这个时间,cookie将消失,不可访问
分享到:
相关推荐
本文主要介绍了Javascript实现登录记住用户名和密码功能的代码。具有很好的参考价值。下面跟着小编一起来看下吧
主要介绍了js使用cookie记录用户名的方法,通过完整实例形式分析了JavaScript针对cookie的创建、赋值及删除等操作技巧,以及通过cookie记录用户登录信息的方法,需要的朋友可以参考下
pwget.js 列出 Windows 上 Chrome 密码保险库中保存的用户名和密码。 跑步: npm install node pwget
本文实例讲述了JS输入用户名自动显示邮箱后缀列表的方法。分享给大家供大家参考。具体如下: 以下是代码,保存到html文件打开: 代码如下:<!doctype html> <html> <head> <meta charset=”UTF-8...
本文实例讲述了js使用cookie实现记住用户名功能。分享给大家供大家参考,具体如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta ...
有时我们需要用cookie保存用户名,记录登录状态,如何正确判断该机用户cookie是否存在呢?不能简单使用a!=”这样的写法。 代码如下: a=getCookie(“username3”); c_start=[removed].indexOf(“username3=”); if(c_...
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]测试方法:加入先输入用户名jb51密码为 www.jb51.net,选择记住密码,然后关闭后,重新打开页面,在用户名里面输入jb51,则密码会自动输入密码。
登录注册页面,相册页面,还可以保存用户名
四、创建两个页面,一个是用户登录页面,另一个是欢迎页面,使用cookie保存用户名 和密码,有效期是一个月。 ----------------------- javascript程序设计练习题全文共2页,当前为第1页。 javascript程序设计练习题...
有时我们需要用cookie保存用户名,记录登录状态,如何正确判断该机用户cookie是否存在呢?不能简单使用a!=”这样的写法。 代码如下: a=getCookie(“username3”); c_start=[removed].indexOf(“username3=”); if...
热情好客小型应用程序,用于保存多个网站的用户名和密码
网上购物商城,可以管理用户,添加用户,管理商品,添加商品,删除商品,可以下订单,可以管理订单,数据交互使用ajax,前端使用jquery,使用js cookie保存用户名,防止后退误操作,防止其他用户登入后台管理页面
目录安装克隆 reop: : 通过$ npm i安装 NPM 包技术/技能JavaScript 节点.js 表示用户名 用法 保存的笔记列表显示在屏幕左侧。 您可以通过单击红色垃圾桶删除笔记,或通过单击标题查看已保存的笔记。 添加注释后,...
js代码-puppeteer自动化发帖子(公司内部论坛),需要输入用户名、密码、发帖子的板块,建议使用测试板块。(保存到本地运行即可,如果看不到内容,使用ctrl+f5刷新页面(如果没有就一直刷新,需要多刷新两次),...
同时为了应对多用户同时使用的需要,加上用户名,每个用户的草稿分开保存。为了说明方便,这里把一些修饰性的东西去掉,这样看起来比较明了 <h2>AJAX应用之草稿自动保存</h2><br> <!– 用户名默认为NONAME –> ...
该应用程序已配置为在保存用户名或消息时侦听以接收来自RethinkDB的推送通知。 支持博客位于[keyholesoftware.com]。 在设置和运行应用程序之前,需要NPM和NODE.jS。 使用的框架: RethinkDB作为数据库 Node.JS...
“蜂鸟” OdinProject 教程的 JavaScript 扫雷器克隆 一个 JavaScript 扫雷应用程序 - 来自 Odin Project.com 的任务大纲。 在这里试试: : 变更日志 ...保存用户名并输出高分 允许自定义网格大小/地雷