前端 使用localStorage 和 Cookie相结合的方式跨页面传递参数
姓名:<input type="text" id="name1">
年龄:<input type="text" id="age1">
<button id="click_btn">点击</button>
// localStorage.name = "张三";
// localStorage.age = 18;//可存储多组数据 var btn = document.getElementById("click_btn");
btn.onclick = function () {
// var username = 'zhangsan'
var username = document.getElementById("name1").value;
// var userage = '13';
var userage = document.getElementById("age1").value;
//存放所有值到数组里
var arrLocalStorage = [username, userage]; //存储,IE6~7 cookie 其他浏览器HTML5本地存储
if (window.localStorage) {
localStorage.setItem("localName", arrLocalStorage);
} else {
Cookie.write("localName", arrLocalStorage);
} } //参考了 https://blog.csdn.net/ZhushiKezhang/article/details/80360998
// var myname = localStorage["name"];//myname 为张三
// console.log(myname) //使用localStorage 和 Cookie相结合的方式传递参数 //条件判断 取localStorage存储值或cookie存储的值
var StoreDate = window.localStorage ? localStorage.getItem("localName") : Cookie.read("localName");
var arrStoreDate = StoreDate.split(","); console.log(arrStoreDate);//取出所有存储的值 console.log(arrStoreDate[0]);//取出第一个值 姓名
console.log(arrStoreDate[1]);//取出第二个值 年龄 // for (var i = 0; i < arrStoreDate.length; i++) {
// var liHtml = "<li>" + arrStoreDate[i] + "</li>";
// $('.list').append(liHtml);
// }
前端 使用localStorage 和 Cookie相结合的方式跨页面传递参数的更多相关文章
- 十一 三种Struts2的数据封装方式,封装页面传递的数据
Struts2的数据封装:Struts2是一个web层框架,框架是软件的半成品.提供了数据封装的基本功能. 注:Struts2底层(核心过滤器里面的默认栈里面的拦截器,具体见struts-defaul ...
- SpringMVC 页面传递参数到controller的五种方式
一共是五种传参方式: 一:直接将请求参数名作为Controller中方法的形参 public String login (String username,String password) : 解 ...
- (网页)html中页面传递参数不用cookie不用缓存,js方法搞定
function GetQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&] ...
- Android通过DeepLink方式跳转其他App传递参数
网上对于安卓DeepLink方式跳转传递参数的例子较少,说的也不客观,实践之后发现还是有一些坑.其实为什么要用DeepLink方式跳转,有些是因为引流的原因,他们希望通过网页就能直接跳转到App的界面 ...
- vue路由传参的三种方式以及解决vue路由传参页面刷新参数丢失问题
最近项目中涉及到跨页面传参数和后台进行数据交互,看到需求之后第一反应就是用路由传参来解决:Vue中给我们提供了三种路由传参方式,下面我们一个一个的来看一下: 方法一:params传参: this.$r ...
- localStorage和cookie的跨域解决方案
原文转自:点我 前言 localStorage和cookie大家都用过,我前面也有文章介绍过,跨域大家也都了解,我前面也有文章详细描述过.但是localStorage和cookie的跨域问题,好多小伙 ...
- localstorage sessionstorage cookie的区别
一.基本概念 Cookie cookie比较小,大小限制在4kb左右,是网景公司的前雇员 LouMontulli 在1993年3月的发明.它的主要用途有保存登录信息,比如你登录某个网站市场可以看到“记 ...
- 前端之web上传文件的方式
前端之web上传文件的方式 本节内容 web上传文件方式介绍 form上传文件 原生js实现ajax上传文件 jquery实现ajax上传文件 form+iframe构造请求上传文件 1. web上传 ...
- sessionStorage 、localStorage 与cookie 的异同点
cookie 容量4kb,默认各种浏览器都支持,缺陷就是每次请求,浏览器都会把本机存的cookies发送到服务器,无形中浪费带宽.userdata,只有ie支持,单个容量64kb,每个域名最多可存10 ...
随机推荐
- 「CF1105E」Helping Hiasat
题目链接 戳我 \(Solution\) 将好友访问你的主页的状态用二进制存下来 其中若第\(i\)位是\(1\),则表示这个好友在第\(i\)个\(1\)操作后访问了你的主页,否则没访问. 所以如果 ...
- Linux 相关系统日志查看
1. 登录日志 cat /var/log/secure 涉及到账号登录的日志信息都会记录在此文件中. 2. Unit 的启动日志 journalctl 可以查看所有 unit 的启动日志,日志的配置文 ...
- HLS协议解析
1. 综述 HLS(HTTP Live Streaming) 把整个流分成一个个小的基于 HTTP 的文件来下载,每次只下载一些.HLS 协议由三部分组成:HTTP.M3U8.TS.这三部分中,HTT ...
- Python 之类与对象及继承
类与对象 学习类的语法 关键字 class 类别,分类class 类名:属性特性特征类名的编写规范:首字母大写 驼峰命令 见名知意--->遵守规范.Math StudentInfoclass S ...
- 域名到IP 报错socket.gaierror: [Errno 8] nodename nor servname provided, or not known
Python中如何通过域名,查看对应的IP? 请看如下代码: import socket hostname="www.baidu.com" ip = socket.gethostb ...
- ubuntu下tomcat运行不起来解决
报错Neither the JAVA_HOME nor the JRE_HOME environment variable is definedAt least one of these enviro ...
- 电脑按住Ctrl+Alt+任何一个方向键。屏幕会改变方向。和IntelliJ IDEA 快捷键冲突,怎么修改?
电脑按住Ctrl+Alt+任何一个方向键.屏幕会改变方向.和IntelliJ IDEA 快捷键冲突,怎么修改? 背景介绍 IntelliJ IDEA默认返回上一步/下一步操作的快捷键是: Ctl+Al ...
- spring boot starter是什么
参考自:https://www.cnblogs.com/EasonJim/p/7615801.html Spring Boot中Starter是什么 比如我们要在Spring Boot中引入Web M ...
- split 使用
split作用:把字符串变成列表,这个字符串必须是多行文字.如果是单行文字或一个单词是不行的,实例操作如下: In [46]: output=subprocess.check_output(['df' ...
- WinRar制作安装包
这次研究了下WinRar制作程序安装包,我使用的是5.21版本. 选中要打包的文件,先压缩为RAR文件,然后双击打开文件 输入目录时可以选择前两项,输入绝对路径时,则为第三项. 配置解压前运行的解压后 ...