原生js创建cookie，功能：点击登录按钮时，将用户名、密码存为cookie；页面再次加载时，自动读取cookie中的用户名、密码。

<html>
<head>
<title>cookies</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
function setCookie(name,value,expiredays)
{
var exdate=new Date();
exdate.setDate(exdate.getDate()+expiredays);
document.cookie=name+ "=" +escape(value)+((expiredays==null) ? "" : ";expires="+exdate.toGMTString());//创建cookie
}

function getCookie(name)//获取cookie
{
if (document.cookie.length>0)
{
c_start=document.cookie.indexOf(name + "=");
if (c_start!=-1)
{
c_start=c_start + name.length+1 ;
c_end=document.cookie.indexOf(";",c_start);
if (c_end==-1) c_end=document.cookie.length;
return unescape(document.cookie.substring(c_start,c_end));
}
}
return "";
}

function checkCookie()//检查cookie是否存在，若存在，读取出来
{
var userName=document.getElementById("userName");
var password=document.getElementById("password");
var UValue=getCookie(userName.id);
var PValue=getCookie(password.id);
if (UValue!=null && UValue!="" && PValue!=null && PValue!="")
{
userName.value=UValue;
password.value=PValue;
}
}

function saveCookie(){//保存cookie
var UName=document.getElementById("userName");
var PName=document.getElementById("password");
if(UName.value==""){
alert("请输入用户名！");
}
else if(PName.value==""){
alert("请输入密码！");
}
else if(confirm("是否保存用户名密码？")){
setCookie(UName.id,UName.value,30);
setCookie(PName.id,PName.value,30);
}
}
</script>
</head>

<body onload="checkCookie()">
<input id="userName" type="text" name="" placeholder="用户名" value="">
<input id="password" type="password" name="" placeholder="密码" value="">
<input type="button" name="" value="登录" onclick="saveCookie()">
</body>
</html>

原生js登录创建cookie的更多相关文章

  1. 原生JS封装创建多级菜单函数

    手写一个使用原生JS封装的多级菜单的函数,满足以下几点需求. 子类层级不确定,可根据数据自动生成多级菜单. 操作便捷,只需传入一个HTML标签. 缺点: 需要满足特定的数据结构 废话不多说,展示代码. ...

  2. 原生JS+ CSS3创建loading加载动画；

    效果图: js创建loading show = function(){ //loading dom元素 var Div = document.createElement("div" ...

  3. 原生js动态创建文本内容的几种方式

    1.通过CreateTextNode文本节点 首先创建该元素(元素节点),然后向一个已存在的元素追加该文本节点 <!DOCTYPE html> <html> <body& ...

  4. 原生js动态创建、获取、删除属性的几种方式

    1.创建属性 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <ti ...

  5. 用JS动态创建登录表单，报了个小错误

    后来发现原来是: dvObj.style.border='#Red 1px sold'; 其中的Red多谢了一个‘#’, 但是奇怪的是在chrome和firefox都备有报错,但是在ie中报错了. 各 ...

  6. 初探原生js根据json数据动态创建table

    初探原生js根据json数据动态创建table 小生以实习生的职位进入了一家非纯软件的公司做asp.net开发,大半个月下来发现公司里居然没有前端工程师,这令我很诧异,跟着公司做项目,发现前端后台没有 ...

  7. 原生js+css实现重力模拟弹跳系统的登录页面

    今天小颖把之前保存的js特效视频看了一遍,跟着视频敲了敲嘻嘻,用原生js实现一个炫酷的登录页面.怎么个炫酷法呢,看看下面的图片大家就知道啦. 效果图: 不过在看代码之前呢,大家先和小颖看看css中的o ...

  8. 使用原生js创建自定义标签

    使用原生js创建自定义标签 效果图 代码 <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  9. 原生js按回车键实现登录

    这篇文章主要介绍了原生JS按回车键实现登录的方法,众所周知,这是在web程序设计中的一个非常实用的小技巧,主要用于表单提交,包括注册.登录等等功能,具有很好的用户体验,有着非常广泛的实用价值,需要的朋 ...

随机推荐

  1. 网络流EK算法模板

    \(EK\)算法的思想就是每一次找一条增广路进行增广. 注意几个点: 存图时\(head\)数组要设为\(-1\). 存图的代码是这样的: inline void add(int u, int v, ...

  2. Django 初试水（一）

    2020年注定是一个不平凡的一年!坚持就是胜利,一起加油! 至于为什么使用 Django,也不想说太多.个人喜欢,这里不做介绍.直接进入主题.show me the code!!! python 的环 ...

  3. Allegro 串扰仿真

    利用于博士的那个电路板,看一下cadence软件的串扰仿真,我们选取3跟信号线,见下图. U6.N3-R36-U7.56 U6.P3-R36-U7.54 U6.P2-R36-U7.53 下面启动sig ...

  4. 修改linux的MAC地址

    命令修改 步骤如下,但不唯一: 1.临时性的修改: ①依次输入以下命令: /sbin/ifconfig eth0 down /sbin/ifconfig eth0 hw ether 00:0C:29: ...

  5. Window逆向基础之逆向工程介绍

    逆向工程 以设计方法学为指导,以现代设计理论.方法.技术为基础,运用各种专业人员的工程设计经验.知识和创新思维,对已有产品进行解剖.深化和再创造. 逆向工程不仅仅在计算机行业.各行各业都存在逆向工程. ...

  6. python3练习100题——014

    这题卡了我一整天,然后还是看答案撸了一遍- 原题链接:http://www.runoob.com/python/python-exercise-example14.html 题目:将一个正整数分解质因 ...

  7. python之路之反射

    这个是上两个的加强版

  8. Java中boolean类型到底占用多少字节（转载）

    来源:https://www.cnblogs.com/brucecloud/p/5509921.html 虽然 Java 虚拟机定义了 boolean 这种数据类型,但是只对它提供了非常有限的支持.在 ...

  9. 第三十二篇 玩转数据结构——AVL树（AVL Tree）

          1.. 平衡二叉树 平衡二叉树要求,对于任意一个节点,左子树和右子树的高度差不能超过1. 平衡二叉树的高度和节点数量之间的关系也是O(logn) 为二叉树标注节点高度并计算平衡因子 AVL ...

  10. 来了，就给自己立个flag

    2019-09-16,刚刚申请的博客园. 不知道不觉,自己已经大四毕业了. 说来惭愧,已经接触IT这方面已经四年了. 但仍然感觉自己像个萌新,啥也不懂,这也不会,那也不会. 8月开始在公司大佬的指导下 ...