window.location.hash 使用说明


Posted in Javascript onNovember 08, 2010

比如loation.href是 页面的url .但是 location.hash可以获取或设置页面的 标签值 比如http://domain/#testDemo中 咱们的location.hash 就是 #testDemo

下面引用一个 网上的demo
一个搜索版块,功能有3个:普通搜索,高级搜索,后台管理,分别指明他们各自的hash 值:#search,#advsearch,#adminboss. 在页面初始化的时候,通过window.location.hash来判断用户需要访问的页面,也就是将要显示的版块

var hash; 
hash = (!window.location.hash)?"#search":window.location.hash; 
window.location.hash = hash; 
//这里我们解释一下(!window.location.hash)什么意思?首先如果当前页面的地址栏的链接地址 不包含#....的这些的话,直接取值的话,他会为空!比如这个例子,https://3water.com/直接取 alert(window.location.hash)//""空 转化为 boolean值 为 false 
// 如果 https://3water.com#hello,world直接取 alert(window.location.hash)//#hello,world 转化为 boolean值 为 true 
//下面的就是 可以用switch判断 
//调整地址栏地址,使前进、后退按钮能使用 
switch(hash){ 
case "#search": 
show("panel1"); 
break; 
case "#advsearch": 
show("panel2"); 
break; 
case "#adminboss": 
show("panel3"); 
break; 
}

下面引用 别人的一句话:
通过window.location.hash=hash这个语句来调整地址栏的地址,使得浏览器里边的“前进”、“后退”按钮能正常使用(实质上欺骗了浏览器)。然后再根据hash值的不同来显示不同的面板(用户可以收藏对应的面板了),这就使得Ajax页面的浏览趋于传统化了。
Javascript 相关文章推荐
jquery学习笔记二 实现可编辑的表格
Apr 09 Javascript
window.open的页面如何刷新(父页面)上层页面
Dec 28 Javascript
Jquery对select的增、删、改、查操作
Feb 06 Javascript
JavaScript如何实现图片懒加载(lazyload) 提高用户体验(增强版)
Nov 30 Javascript
JS 实现随机验证码功能
Feb 15 Javascript
jquery操作select取值赋值与设置选中实例
Feb 28 Javascript
Javascript中 toFixed四舍六入方法
Aug 21 Javascript
JavaScript+CSS相册特效实例代码
Sep 07 Javascript
深入理解Vue官方文档梳理之全局API
Nov 22 Javascript
新手快速入门JavaScript装饰者模式与AOP
Jun 24 Javascript
如何将JavaScript将数组转为树形结构
Jun 02 Javascript
vue本地构建热更新卡顿的问题“75 advanced module optimization”完美解决方案
Aug 05 Vue.js
JavaScript游戏之是男人就下100层代码打包
Nov 08 #Javascript
JavaScript游戏之优化篇
Nov 08 #Javascript
javascript开发中因空格引发的错误
Nov 08 #Javascript
window.ActiveXObject使用说明
Nov 08 #Javascript
发布一个基于javascript的动画类 Fx.js
Nov 05 #Javascript
微博@符号的用户名提示效果。(想@到谁?)
Nov 05 #Javascript
js focus不起作用的解决方法(主要是因为dom元素是否加载完成)
Nov 05 #Javascript
You might like
php中处理mysql_fetch_assoc返回来的数组 不用foreach----echo
2011/05/04 PHP
Thinkphp中volist标签mod控制一定记录的换行BUG解决方法
2014/11/04 PHP
PHP内置加密函数详解
2016/11/20 PHP
php实现基于pdo的事务处理方法示例
2017/07/21 PHP
Laravel模糊查询区分大小写的实例
2019/09/29 PHP
jQuery 使用手册(二)
2009/09/23 Javascript
通过jQuery打造支持汉字,拼音,英文快速定位查询的超级select插件
2010/06/18 Javascript
JS+CSS实现鼠标经过弹出一个DIV框完整实例(带缓冲动画渐变效果)
2016/03/25 Javascript
Window.Open打开窗体和if嵌套代码
2016/04/15 Javascript
javascript正则表达式中分组详解
2016/07/17 Javascript
Vue.js实现一个自定义分页组件vue-paginaiton
2016/09/05 Javascript
Vue开发中整合axios的文件整理
2017/04/29 Javascript
vue 中自定义指令改变data中的值
2017/06/02 Javascript
el-select 下拉框多选实现全选的实现
2019/08/02 Javascript
用原生JS实现爱奇艺首页导航栏代码实例
2019/09/19 Javascript
js实现简单的日历显示效果函数示例
2019/11/25 Javascript
Vue+elementUI实现多图片上传与回显功能(含回显后继续上传或删除)
2020/03/23 Javascript
Django配置celery(非djcelery)执行异步任务和定时任务
2018/07/16 Python
Python3实现统计单词表中每个字母出现频率的方法示例
2019/01/28 Python
利用python-pypcap抓取带VLAN标签的数据包方法
2019/07/23 Python
Django如何使用第三方服务发送电子邮件
2019/08/14 Python
tensorflow 固定部分参数训练,只训练部分参数的实例
2020/01/20 Python
PyQt5 QDockWidget控件应用详解
2020/08/12 Python
python代码实现图书管理系统
2020/11/30 Python
Bugatchi官方网站:男士服装在线
2019/04/10 全球购物
俄罗斯宠物用品网上商店:ZooMag
2019/12/12 全球购物
ShellScript面试题一则-ShellScript编程
2014/06/24 面试题
管理学专业个人求职信范文
2013/09/21 职场文书
社区工作者感言
2014/03/02 职场文书
党员干部承诺书
2014/03/25 职场文书
《独坐敬亭山》教学反思
2014/04/08 职场文书
创建文明城市标语
2014/06/16 职场文书
英语教育专业毕业生求职信
2014/08/28 职场文书
法制教育演讲稿
2014/09/10 职场文书
会计试用期自我评价
2014/09/19 职场文书
Android移动应用开发指南之六种布局详解
2022/09/23 Java/Android