location.hash来保持页面状态
/*本例是为了在客户端页面返回时保存状态,采用hash值记录的模式,为了使用方便所写的存取hash值的库,时间仓促,望指出错误。*/
var pageStateHash = {
hashArray: [],
getHashArray: function() {
var _self = this;
if (window.location.hash.replace('#','') != '') {
_self.hashArray = window.location.hash.replace('#','').split('&');
}
},
applyHash: function() {
var _self = this;
window.location.hash = '#' + _self.hashArray.join('&');
},
hashIndex: function(key) {
var _self = this;
var ret = -1;
_self.getHashArray();
for (var i in _self.hashArray) {
var item = _self.hashArray[i].split('=');
var length = item.length;
if (length == 2 && item[0] == key) {
ret = i;
}
}
return ret;
},
set: function(key, value) {
var _self = this;
var hashIndex = _self.hashIndex(key);
console.log('hash index = '+hashIndex);
if (hashIndex == -1) {
_self.hashArray.push(key + '=' + value);
} else {
_self.hashArray[hashIndex] = key + '=' + value;
} _self.applyHash();
},
get: function(key) {
var _self = this;
var hashIndex = _self.hashIndex(key);
if (hashIndex == -1) {
return '';
} else if (_self.hashArray[hashIndex].split('=').length == 2) {
return _self.hashArray[hashIndex].split('=')[1];
}
}
};
/*pageStateHash.set('cate1', '8');
pageStateHash.set('cate2', '9');
console.log('get cate2 index:' +pageStateHash.get('cate2'));*/
location.hash来保持页面状态的更多相关文章
- 巧用location.hash保存页面状态
在我们的项目中,有大量ajax查询表单+结果列表的页面,由于查询结果是ajax返回的,当用户点击列表的某一项进入详情页之后,再点击浏览器回退按钮返回ajax查询页面,这时大家都知道查询页面的表单和结果 ...
- 使用location.hash保存页面状态
hash 属性是一个可读可写的字符串,该字符串是 URL 的锚部分(从 # 号开始的部分). 语法 location.hash 在我们的项目中,有大量ajax查询表单+结果列表的页面,由于查询结果是a ...
- 学习笔记:location.hash和history.pushState()
在浏览器中改变地址栏url,将会触发页面资源的重新加载,这使得我们可以在不同的页面间进行跳转,得以浏览不同的内容.但随着单页应用的增多,越来越多的网站采用ajax来加载资源.因为异步加载的特性,地址栏 ...
- 前端 JS 原生 javascript 和 location.hash 实现一个单页应用的路由 router
开篇日常立个flag-- 前言 最近在做一些应用,类似于单页应用,想实现类似于 Vue 路由的效果. 但是个人 Vue 基础四舍五入约等于无,而且看着 Vue-router 吃力+用不起来(因为我的项 ...
- 简单使用location.hash的方法 ,怎么做,有什么用? 简单的js路由页面方法。
hash 属性是一个可读可写的字符串,该字符串是URL的锚部分(从#号开始的部分).语法location.hash刚开始我真不知道hash有什么用,直到我在项目中遇上一个最大的问题.而且很恶心的体验 ...
- window.location.hash 页面跳转,精确定位,实例展示:
window.location.hash 页面跳转,精确定位,实例展示: (1).index.phtml,页面用于传参 <script id="bb_list_template&quo ...
- window.location.hash(hash应用)---跳转到hash值制定的具体页面
location是javascript里边管理地址栏的内置对象,比如location.href就管理页面的url,用location.href=url就可以直接将页面重定向url.而location. ...
- js 利用iframe和location.hash跨域解决的方法,java图片上传回调JS函数跨域
奶奶的:折腾了我二天,最终攻克了!网上有非常多样例. 但跟我的都不太一样,费话不多说了,上图 上代码: IE ,firefix,chrome 測试通过 js :这个主页面,部分代码, functi ...
- window.location.hash 使用说明
本文给大家详细汇总了关于window.location.hash的知识点,属性以及用法等等,非常的实用,并附上了例子,有需要的小伙伴可以参考下. location是javascript里边管理地址 ...
随机推荐
- QT5.3无法自动调用incomingConnection函数的问题(4.7没有这个问题)
最近将qt4.7的一个工程移到5.3,遇到了几个麻烦事,主要是这个incomingConnection监听后无法自动调用的问题,在4.7上是完全没有问题的,到了5.3就不行,网上也查了下,网友们都是放 ...
- AlarmManager.RTC和ELAPSED_REALTIME的区别
AlarmManager.RTC,硬件闹钟,不唤醒手机(也可能是其它设备)休眠:当手机休眠时不发射闹钟. AlarmManager.RTC_WAKEUP,硬件闹钟,当闹钟发躰时唤醒手机休眠: Alar ...
- C# winform窗体假死
C# winform窗体假死 我们经常会遇到当执行一个比较大的函数时,窗体会出现假死的现象,给用户的体验不是很好,于是我们遇到了问题,那么就必须解决,我们该如何解决呢,首先在自己的脑里画个问号,接下 ...
- SQLite的介绍 操作Sqlite 具体实例
1.SQLite简介 SQLite是一款轻型的数据库,是遵守ACID的关联式数据库管理系统,它的设计目标是嵌入 式的,而且目前已经在很多嵌入式产品中使用了它,它占用资源非常的低,在嵌入式设备中,可能 ...
- java 反编译插件 JD-Eclipse 和 JD-IntelliJ
去官网 : http://jd.benow.ca/ 找到 JD-Eclipse 和 JD-IntelliJ,下载,前者安在eclipse上,后者安在as上.
- PHP 时间函数 date 参数详解
time();表示的是从1970-01-01到现在共走了多少秒,不便于看,但便于计算 要找出前一天的时间就是 time()-60*60*24; 要找出前一年的时间就是 time()*60*60*24* ...
- linux/shell 文本文件删除/删掉空行
分别用sed awk perl grep 实现: sed '/^$/d' input.txt > output.txt #output file: output.txt sed -i '/^$/ ...
- Linux进程控制(二)
1. 进程的创建 Linux下有四类创建子进程的函数:system(),fork(),exec*(),popen() 1.1. system函数 原型: #include <stdlib.h&g ...
- Qt之QHeaderView自定义排序(QSortFilterProxyModel)
简述 对以上节的排序,我们衍伸了两点: 把一个字符串前面的数据按照字符串比较,而后面的数据按照整形比较. 将整形显示为字符串,而排序依然正常呢. 为了分别描述,这里我们先解决问题1. 简述 效果 处理 ...
- LA 4255 (拓扑排序 并查集) Guess
设这个序列的前缀和为Si(0 <= i <= n),S0 = 0 每一个符号对应两个前缀和的大小关系,然后根据这个关系拓扑排序一下. 还要注意一下前缀和相等的情况,所以用一个并查集来查询. ...