JS-记住用户名【cookie封装引申】

简介: 1 DOCTYPE html> 2 3 4 5 调用封装好的cookie文件来制作小案例 6 7 8 9 10 11 12 ...
 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title>调用封装好的cookie文件来制作小案例</title>
 6         <script src="cookie.js" type="text/javascript" charset="utf-8"></script>
 7     </head>
 8     <body>
 9         <form action="" method="post" id="form1">
10             <input type="text" name="user" id="user" value="56" />
11             <input type="password" name="pass" id="pass" value="" />
12             <input type="submit" value="提交" id="btn"/>
13         </form>
14         
15     </body>
16     <script type="text/javascript">
17         var oTxt1 = document.getElementsByName('user')[0],
18             oForm1 = document.getElementById('form1'),
19             oBtn = document.getElementById('btn');
20         oForm1.onsubmit = function(){
21             setCookie('user',oTxt1.value,14);
22         }
23         oTxt1.value = getCookie('user');
24     </script>
25 </html>

 

cookie.js

 1 /*****设置cookie*****/
 2 function setCookie(name, value, iDay) {
 3     var oDate = new Date();
 4     oDate.setDate(oDate.getDate() + iDay);
 5     document.cookie = name + '=' + value + ';expires=' + oDate;
 6 }
 7 /*****获取cookie*****/
 8 function getCookie(name) {
 9     var arr = document.cookie.split("; ");
10     for(var i = 0; i < arr.length; i++) {
11         var arr2 = arr[i].split("=");
12         if(arr2[0] == name) {
13             return arr2[1]
14         }
15     }
16     return ""
17 }
18 /*****移除cookie*****/
19 function removeCookie(name) {
20     setCookie(name, 1, -1);
21 };

 

目录
相关文章
|
1月前
sd.js 2.0封装:更加简化请求传参内容(逐步废弃、逐渐日落2024.01.02)
sd.js 2.0封装:更加简化请求传参内容(逐步废弃、逐渐日落2024.01.02)
|
2月前
|
Java 数据安全/隐私保护
jsp使用cookie实现记住用户名和密码
jsp使用cookie实现记住用户名和密码
14 0
|
2月前
|
JavaScript
JS封装节流函数
JS封装节流函数
19 0
|
2月前
uni-app 65egg.js聊天类chat.js封装(二)
uni-app 65egg.js聊天类chat.js封装(二)
29 1
|
4月前
|
存储 JavaScript 前端开发
js中session、cookie、 localStorage和SessionStorage的区别和特点
js中session、cookie、 localStorage和SessionStorage的区别和特点
|
15天前
|
SQL 存储 前端开发
React&Nest.js全栈社区平台(五)——👋封装通用分页Service实现文章流与详情
React&Nest.js全栈社区平台(五)——👋封装通用分页Service实现文章流与详情
React&Nest.js全栈社区平台(五)——👋封装通用分页Service实现文章流与详情
|
27天前
|
存储 JavaScript 前端开发
JavaScript中的cookie、localStorage的区别和特点
JavaScript中的cookie、localStorage的区别和特点
19 6
|
29天前
|
存储 JavaScript 前端开发
JavaScript DOM 操作:解释一下 cookie、sessionStorage 和 localStorage 的区别。
Cookie是服务器发送至客户端的文本信息,会随每个请求发送回服务器,适合控制会话状态但可能暴露隐私。SessionStorage仅在当前会话中存储数据,关闭浏览器后清除,适合临时存储如登录状态。LocalStorage则持久保存数据,即使关闭浏览器也不会清除,适用于存储长期设置。三种方式各有侧重,应按需求选择。
17 0
|
6月前
|
存储 JavaScript 前端开发
js中session、cookie、 localStorage和SessionStorage的区别和特点
js中session、cookie、 localStorage和SessionStorage的区别和特点
45 0
|
2月前
uni-app 66聊天类chat.js封装(三)
uni-app 66聊天类chat.js封装(三)
33 6