页面之间的跳转经常使用a标签,使用mvc框架的都是通过访问controller的请求方法,返回请求页面。但本次开发,前端与后台完全分离,前端APP使用HBuider来开发,后台数据就无法使用mvc框架访问数据的方法了。

H5提供了本地存储用户浏览数据的方法,早些时候,本地存储使用的是 cookie。但是Web 存储需要更加的安全与快速. 这些数据不会被保存在服务器上,但是这些数据只用于用户请求网站数据上.它也可以存储大量的数据,而不影响网站的性能。

数据以 键/值 对存在, web网页的数据只允许该网页访问使用。

主要使用的是localStorage和sessionStorage对象。 localStorage - 没有时间限制的数据存储; sessionStorage - 针对一个 session 的数据存储(关闭窗口,存储的数据清空)。

1.  localStorage实现方式:

(1)存储:localStorage.setItem("name","张三");

(2)获取数据:var name=localStorage.getItem("name");

(3)移除: localStorage.removeItem("name");

(4)清楚所有:localStorage.clear();

(5)保存非字符串,需要使用JSON转化:

存:oStorage.setItem('data', JSON.stringify(data));  取:var data = JSON.parse(oStorage.getItem('data'));

2.  sesstionStorage的方式与localStorage基本相同:

sessionStorage.setItem("key", "value"); var value = sessionStorage.getItem("key");

3.  与cookie比较:

a. 它存储容量更大 b. 每次请求,cookie都要被传送,浪费带宽,另外,cookie不可以跨域访问

4. 页面跳转举例:

mui页面跳转并传值:

function showDetails(msgSource){ mui.openWindow({ url:viewUrl+"Character1.html", id:"Character1.html", extras:{"companyID":companyID,"msgSource":msgSource,"msg_type":msg_type} }); }

a标签跳转:<a href="'+viewUrl+'Character1.html?msg_source='+data.result[i].msgSource+'"  class="more">

调用方法跳转:</div>'+'<a href="javascripte:;" onclick="javascript:showDetails('+data.result[i].msgSource+')"  class="more">查看详情</a>

页面刷新:window.location.reload();

H5页面跳转与传值的更多相关文章

  1. iOS——使用StroryBoard页面跳转及传值

    之前在网上搜iOS的页面跳转大多都是按回以前的那种xib的形式,但鄙人是使用storyboard的.这篇就只介绍利用storyboard进行页面跳转与传值. 新建页面 iOS的程序也是使用了MVC的思 ...

  2. iOS使用StroryBoard页面跳转及传值

    之前在网上iOS的页面跳转大多都是按回以前的那种xib的形式,但鄙人是使用storyboard的.这篇就只介绍利用storyboard进行页面跳转与传值. 新建页面 iOS的程序也是使用了MVC的思想 ...

  3. 判断终端类型、微信的文章防盗链、h5页面跳转打开新的app、跳转到app市场

    判断终端的类型.安卓.ios.微信.qq function  GetMobelType()  {                 var  browser  =   {                 ...

  4. Android中实现activity的页面跳转并传值

    一个Android应用程序很少会只有一个Activity对象,如何在多个Activity之间进行跳转,而且能够互相传值是一个很基本的要求. 本次我们就讲一下,Android中页面跳转以及传值的几种方式 ...

  5. Intent实现页面跳转和传值

    *Intent称为意图,是Android各大组件连接的桥梁 1.Activity页面跳转 同一个包内 Intent intent = new Intent(); intent.setClass(Mai ...

  6. MVC 【Razor 视图引擎】基础操作 --页面跳转,传值,表单提交

    ASPX  与  Razor  仅仅是视图不一样. 新建项目----ASP.NET MVC 4 Web 应用程序------选择模板(空).视图引擎(Razor ) 1.视图中 c# 代码  与 HT ...

  7. flutter -------- 页面跳转和传值

    在安卓原生开发中,页面跳转可以用Intent类来具体实现: Intent intent =new Intent(MainActivity.this,second.class); startActivi ...

  8. H5页面跳转到小程序代码

    1.H5页面加代码直接打开小程序 <script type="text/javascript src="https://res.wx.qq.com/open/js/jweix ...

  9. 微信公众号开发之H5页面跳转到指定的小程序

    前言: 最近公司有一个这样的需要,需要从我们在现有的公众号H5页面中加一个跳转到第三方小程序的按钮.之前只知道小程序之间是可以相互跳转的,今天查阅了下微信开发文档原来现在H5网页也支持小程序之间的跳转 ...

随机推荐

  1. C++ STL(标准模板库)的学习了解

    C++ STL(标准模板库)是一套功能强大的 C++ 模板类,提供了通用的模板类和函数,这些模板类和函数可以实现多种流行和常用的算法和数据结构,如向量.链表.队列.栈. C++ 标准模板库的核心包括以 ...

  2. 一种Winform类electron的实现

    最近看了一篇文章  Winform客户端内嵌Vue页面  使用html作为winform的界面(其实这种做法早在MFC时代就已经有了),不过感觉文章中的封装并不够彻底,所以我忍不住要发一篇博客来说说我 ...

  3. html上传文件限制、前端限制文件类型

    <input id="file" type="file" accept=".xls,.xlsx" style="width: ...

  4. HashMap多线程并发问题分析-正常和异常的rehash1(阿里)

    多线程put后可能导致get死循环 从前我们的Java代码因为一些原因使用了HashMap这个东西,但是当时的程序是单线程的,一切都没有问题.后来,我们的程序性能有问题,所以需要变成多线程的,于是,变 ...

  5. centos上传命令

    首先安装lrzsz # yum -y install lrzsz 1.上传文件,执行命令rz,会跳出文件选择窗口,选择好文件,点击确认即可. # rz 运行rz命令后弹出选择文件窗口,找到要上传的文件 ...

  6. Dubbo的集群容错与负载均衡策略及自定义(一致性哈希路由的缺点及自定义)

    Dubbo的集群容错策略 正常情况下,当我们进行系统设计时候,不仅要考虑正常逻辑下代码该如何走,还要考虑异常情况下代码逻辑应该怎么走.当服务消费方调用服务提供方的服务出现错误时候,Dubbo提供了多种 ...

  7. CentOS 7.5 安装Oracle 11gR2 86%报错:Error in invoking target 'agent nmhs' of makefile

    解决方案: 不要关闭安装过程,另外打开终端窗口,将ins_emagent.mk文件中的 (MK_EMAGENT_NMECTL)更改为$(MK_EMAGENT_NMECTL) -lnnz11,然后在安装 ...

  8. Jav获取文件的MD5码,比较两个文件内容是否相同

    Jav获取文件的MD5码,比较两个文件内容是否相同 代码: System.out.println(DigestUtils.md5Hex(new FileInputStream(new File(&qu ...

  9. scrapy之CrawlSpiders

    CrawlSpiders 通过下面的命令可以快速创建 CrawlSpider模板 的代码: scrapy genspider -t crawl loaderan cnblogs.com class s ...

  10. MySQL导数据笔记

    2019-12-16 9:08:43 星期一 MySQL 5.6 limit / order 有bug, 如果主键不是自增的, 只能全表导出导入, 增量导入导出的话会报主键重复 触发器: 批量导入数据 ...