hashchange
<!DOCTYPE html>
<html>
<head>
<title>Hash Change Example</title>
<script type="text/javascript" src="EventUtil.js"></script>
</head>
<body>
<p>Click each of these links to change the URL hash.</p>
<ul>
<li><a href="#up">Up</a></li>
<li><a href="#down">Down</a></li>
</ul>
<p>This example only works in browsers that <code>onhashchange</code>.</p>
<script type="text/javascript">
EventUtil.addHandler(window, "hashchange", function(event){
alert("Old URL: " + event.oldURL + "\nNew URL: " + event.newURL);
});
$(function(){
var hashValue = location.hash.slice(1);
if(hashValue) {
$(window).trigger("hashchange");
}
});
</script>
</body>
</html>
hashchange事件支持 IE8 FF3.6 chrome opera
event.oldURL, newURL 只有FF6, chrome opera
hashchange的更多相关文章
- 理解浏览器历史记录(2)-hashchange、pushState
本文也是一篇基础文章.继上文之后,本打算去研究pushState,偶然在一些信息中发现了锚点变化对浏览器的历史记录也会影响,同时锚点的变化跟pushState也有一些关联.所以就花了点时间,把这两个东 ...
- hashchange事件的认识
写过路由的同学都知道其原理是通过URL的改变,由导航信息来决定页面信息...表述的好像有点不准确 这么说吧,只要URL参数列表只要变化就会调用hashchange事件,此时event对象包括oldUR ...
- jQuery不支持hashchange事件?
$(window) .bind( 'hashchange', onHashchange ) .trigger( 'hashchange' ); jQuery版本是1.9.1的,去源码里没找到hashc ...
- AJAX保留浏览历史的解决方案——hashchange()
在ajax请求中,不能更新地址栏,地址栏上的“前进”和“后退”按钮就失效了,带来了另外一种糟糕的用户体验. 解决方案如下: 方案一:使用window. Onhashchange 事件 如下面Html片 ...
- WebApp 中用 hashchange 做路由解析
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 简单的基于hash和hashchange的前端路由
hash定义 hash这个玩意是地址栏上#及后面部分,代表网页中的一个位置,#后面部分为位置标识符.页面打开后,会自动滚动到指定位置处. 位置标识符 ,一是使用锚点,比如<a name=&quo ...
- 基于hashchange导航管理
想在五一放假的时候写出来,由于放假有点兴奋,心早就跑了,不废话了. 说一下基于hashchange导航管理: 浏览器的历史记录导航是用户非常常用的功能,除了点击前进后退按钮外,Window上的hist ...
- hashChange & url change & QRCode & canvas to image
hashChange & url change & QRCode & canvas to image "use strict"; /** * * @auth ...
- js中hash、hashchange事件
1.hash即URL中"#"字符后面的部分. ①使用浏览器访问网页时,如果网页URL中带有hash,页面就会定位到id(或name)与hash值一样的元素的位置: ②hash还有另 ...
随机推荐
- CNS的数据库搜索网站可用solr实现
使用solr的DIH (data import handler) 可以操作后台数据库,前端solr自带的search ui (localhost:8983/solr/collection1/brows ...
- CSS样式覆盖规则
有一下问题, 想让下面的border生效 ,#比. 优先级高, #navigator { height: 100%; width: 200; position: absolute; left: 0; ...
- Servlet程序开发--实例操作:MVC设计模式应用
以前做过一个登录程序,是用JSP+JavaBean完成的,最大的问题,JSP文件内容太多了. 1. VO 2. DBC 3. DAO 3.1 impl 3.2 proxy 4. Factory 5. ...
- Nginx配置-伪静态,隐藏index.php大入口
server { listen ; server_name ; root E:/www/wvtuan/; index index.php index.html; log_not_found off; ...
- Application对象
Application对象报讯是应用程序参数的额,多个用户可以共享一个Application.用于启动和管理ASP.NET应用程序. Count 属性 获取Application对象变量的个数,集合 ...
- ural1037 Memory Management
Memory Management Time limit: 2.0 secondMemory limit: 64 MB Background Don't you know that at school ...
- 使用GDB调试Android NDK native(C/C++)程序-转
最 近写了些需要跨平台兼容的C++库,Android是其中需要兼容的平台之一.区别于Windows,Mac中功能强大的IDE环境,官方并没有为 Android ndk提供太多的支持.因此,尝试了下通过 ...
- Python3基础 函数名.__doc__显示一个函数的单行与多行函数文档
镇场诗: 诚听如来语,顿舍世间名与利.愿做地藏徒,广演是经阎浮提. 愿尽吾所学,成就一良心博客.愿诸后来人,重现智慧清净体.-------------------------------------- ...
- 关于js的连续赋值
首先,来看一个经典的案例: <script>var a = {n: 1}var b = a;a.x = a = {n: 2}alert(a.x);alert(b.x);</scrip ...
- Super Jumping! Jumping! Jumping! 基础DP
Super Jumping! Jumping! Jumping! Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 ...