前端 使用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 ...
随机推荐
- mybatis延迟加载(Collection)
上篇讲了assocation,同样我们也可以在一对多关系配置的结点中配置延迟加载策略. 结点中也有 select 属性,column 属性. 需求: 完成加载用户对象时,查询该用户所拥有的账户信息. ...
- 【免费电子书】这可能是全网最齐的程序员编程电子书PDF合集了!
[toc] 最近博主
- python:将numpy数组写入csv文件
import numpy as np np.savetxt('E:\\forpython\\featvector.csv',data_to_save,delimiter=',')
- 百度地图js判断点是否在圆形区域内
/** * Created by LEGION on 2018/10/11. *//** * @fileoverview GeoUtils类提供若干几何算法,用来帮助用户判断点与矩形. * 圆形.多边 ...
- 理解MVC/MVP/MVVM的区别
转载至[http://www.ruanyifeng.com/blog/2015/02/mvcmvp_mvvm.html] MVC 所有的通信都是单向的. M(Model)V(View)C(Contro ...
- LC 537. Complex Number Multiplication
Given two strings representing two complex numbers. You need to return a string representing their m ...
- 【SQL】MySQL---using的用法
学习记录: mysql中using的用法为: using()用于两张表的join查询,要求using()指定的列在两个表中均存在,并使用之用于join的条件
- linux/windows/Mac平台生成随机数的不同方法
linux平台,使用rand.Seed() //rand_linux.go package main import ( "math/rand" "time" ) ...
- EPOLL内核原理极简图文解读(转)
预备知识:内核poll钩子原理内核函数poll_wait把当前进程加入到驱动里自定义的等待队列上 当驱动事件就绪后,就可以在驱动里自定义的等待队列上唤醒调用poll的进程 故poll_wait作用:可 ...
- EL表达式与JSTL标签库(一)
1.JSTL概述 JSTL标签库由标签库和EL表达式两个部分组成.JSTL标准标签库(Java Server Page Standard Tag Library),用来解决创建的页面的操作问题,包括输 ...