window.location.hash(hash应用)---跳转到hash值制定的具体页面
location是javascript里边管理地址栏的内置对象,比如location.href就管理页面的url,用location.href=url就可以直接将页面重定向url。而location.hash则可以用来获取或设置页面的标签值。比如http://domain/#admin的location.hash="#admin"。利用这个属性值可以做一个非常有意义的事情。
很多人都喜欢收藏网页,以便于以后的浏览。不过对于Ajax页面来说的话,一般用一个页面来处理所有的事务,也就是说,如果你浏览到一个Ajax页面里边有意思的内容,想将它收藏起来,可是地址只有一个呀,下次你打开这个地址,还是得像以往一样不断地去点击网页,找到你钟情的那个页面。另外的话,浏览器上的“前进”“后退”按钮也会失效,这于很多习惯了传统页面的用户来说,是一个很大的使用障碍。
那么,怎么用location.hash来解决这两个问题呢?其实一点也不神秘。
比如,我的作者管理系统,主要功能有三个:普通搜索、高级搜索、后台管理,我分别给它们分配一个hash值:#search、#advsearch、#admin,在页面初始化的时候,通过window.location.hash来判断用户需要访问的页面,然后通过javascript来调整显示页面。比如:
hash=(!window.location.hash)?"#search":window.location.hash;
window.location.hash=hash;
//调整地址栏地址,使前进、后退按钮能使用
switch(hash){
case "#search":
selectPanel("pnlSearch"); //显示普通搜索面板
break;
case "#advsearch":
case "#admin":
}
================================备注================================================
而popstate, 及相关api, pushState等属于HTML5新标准, 产生的目的就是做客户端前进后退的, 不仅可以支持hash, 非hash的同源url也支持.
所以一般用法是浏览器支持就用popstate, 不支持再降级使用hashchange,
window.location.hash(hash应用)---跳转到hash值制定的具体页面的更多相关文章
- 遇到问题-----JS中设置window.location.href跳转无效(在a标签里或这form表单里)
问题情况 JS中设置window.location.href跳转无效 代码如下: ? 1 2 3 4 5 6 7 8 <script type="text/javascript&quo ...
- javascript 中设置window.location.href跳转无效问题解决办法
javascript 中设置window.location.href跳转无效问题解决办法 问题情况 JS中设置window.location.href跳转无效 原因是 a标签的href跳转会执行在wi ...
- window.location.href跳转无效
window.location.href跳转无效 问题情况 JS中设置window.location.href跳转无效 原因是 a标签的href跳转会执行在window.location. ...
- window.location下的属性说明
属性 说明 window.location.href 完整的url window.location.protocol 协议 window.location.hostname 主机名 window.lo ...
- window.location和window.location.href和document.location的关系
1,首先来区分window.location和window.location.href. window.location.href是一个字符串. 而window.location是一个对象,包含属性有 ...
- window.loaction.href 不自动跳转的问题
window.location.href无效/不跳转的原因分析 1.源代码: <a href="javascript:void(0);" onclick="mo ...
- window.location.replace和window.location.href区别
有3个页面 a,b,c 如果当前页面是c页面,并且c页面是这样跳转过来的:a->b->c 1:b->c 是通过window.location.replace("..xx/c ...
- window.location.replace()与window.location.href()区别
有3个页面 a,b,c 如果当前页面是c页面,并且c页面是这样跳转过来的:a->b->c 1:b->c 是通过window.location.replace("..xx/c ...
- window.location.replace
有3个页面 a,b,c 如果当前页面是c页面,并且c页面是这样跳转过来的:a->b->c 1:b->c 是通过window.location.replace("..xx/c ...
随机推荐
- C语言作业11
问题 答案 这个作业属于那个课程 C语言程序设计 这个作业要求在哪里 https://www.cnblogs.com/galen123/p/11996995.html 我在这个课程的目标是 在学好C语 ...
- HDU 1176 免费馅饼 (动态规划、另类数塔)
免费馅饼 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Submis ...
- airflow部署
官网: http://airflow.apache.org/installation.html 原理: https://www.cnblogs.com/cord/p/9450910.html 安装: ...
- DataFrame.to_dict(orient='dict')
DataFrame.to_dict(orient=’dict’) >>> df = pd.DataFrame({'name':[1,2,3],"class":[1 ...
- hdu2444The Accomodation of Students (最大匹配+判断是否为二分图)
题意 首先判断所有的人可不可以分成两部分,每部分内的所有人都相互不认识.如果可以分成 则求两部分最多相互认识的对数. 解题 类似分成两组,同组互不相关,就可能使判断是否为二分图 能否分成两部分 则是判 ...
- java中<<,>>和>>>的含义
<<,>>,>>>为java中的移位运算符. <<表示左移运算符 例如8<<2,表示将8向左移2位,结果为32.低位补0. 二进制演算 ...
- hadoop面试复习笔记(1)
0.Mappereduce采用的是Master/Slaves模型 1.Hadoop是一个开源软件框架,支持支持大数据集的存储和处理.Apache Hadoop是存储和处理大数据的解决方案你是因为: ( ...
- 机器学习-非线性回归(Logistic Regression)及应用
1. 概率 1.1 定义:概率(Probability):对一件事情发生的可能性的衡量. 1.2 范围:0 <= P <= 1 1.3 计算方法: 1.3.1 根据个人置信 1.3.2 根 ...
- git上传文件夹报错: ! [rejected] master -> master (fetch first) error: failed to push some refs to 'https://github.com/taminachen/rjxm.git' hint: Updates were rejected because the remote contains work
使用git上传本地文件夹到远程仓库,使用如下命令:git push -u origin master时报错 原因是在GitHub创建仓库时创建了readme文件,但是本地没有这个文件,造成本地目录与远 ...
- 一个线程oom,进程里其他线程还能运行吗?
线程之间互相不影响:守护线程生活周期相同 引言 这题是一个网友@大脸猫爱吃鱼给我的提问,出自今年校招美团三面的一个真题.大致如下 一个进程有3个线程,如果一个线程抛出oom,其他两个线程还能运行么? ...