<!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的更多相关文章

  1. 理解浏览器历史记录(2)-hashchange、pushState

    本文也是一篇基础文章.继上文之后,本打算去研究pushState,偶然在一些信息中发现了锚点变化对浏览器的历史记录也会影响,同时锚点的变化跟pushState也有一些关联.所以就花了点时间,把这两个东 ...

  2. hashchange事件的认识

    写过路由的同学都知道其原理是通过URL的改变,由导航信息来决定页面信息...表述的好像有点不准确 这么说吧,只要URL参数列表只要变化就会调用hashchange事件,此时event对象包括oldUR ...

  3. jQuery不支持hashchange事件?

    $(window) .bind( 'hashchange', onHashchange ) .trigger( 'hashchange' ); jQuery版本是1.9.1的,去源码里没找到hashc ...

  4. AJAX保留浏览历史的解决方案——hashchange()

    在ajax请求中,不能更新地址栏,地址栏上的“前进”和“后退”按钮就失效了,带来了另外一种糟糕的用户体验. 解决方案如下: 方案一:使用window. Onhashchange 事件 如下面Html片 ...

  5. WebApp 中用 hashchange 做路由解析

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. 简单的基于hash和hashchange的前端路由

    hash定义 hash这个玩意是地址栏上#及后面部分,代表网页中的一个位置,#后面部分为位置标识符.页面打开后,会自动滚动到指定位置处. 位置标识符 ,一是使用锚点,比如<a name=&quo ...

  7. 基于hashchange导航管理

    想在五一放假的时候写出来,由于放假有点兴奋,心早就跑了,不废话了. 说一下基于hashchange导航管理: 浏览器的历史记录导航是用户非常常用的功能,除了点击前进后退按钮外,Window上的hist ...

  8. hashChange & url change & QRCode & canvas to image

    hashChange & url change & QRCode & canvas to image "use strict"; /** * * @auth ...

  9. js中hash、hashchange事件

    1.hash即URL中"#"字符后面的部分. ①使用浏览器访问网页时,如果网页URL中带有hash,页面就会定位到id(或name)与hash值一样的元素的位置: ②hash还有另 ...

随机推荐

  1. hibernate事务并发问题(脏读,不可重复读,幻读)

    脏读  dirty read:  读了别的事务没有提交的事务, 可能回滚, 数据可能不对. 不可重复读 non repeatable read: 同一个事务里前后读出来的数据不一样, 被另一个事务影响 ...

  2. Servlet程序开发--取得初始化配置信息

    代码: 两个初始化init方法,一起出现的话,有参的才起作用 package org.lxh.servletdemo ; import java.io.* ; import javax.servlet ...

  3. CF 365 div2 D

    http://codeforces.com/contest/703/problem/D 题目大意:给你一个长度为n数组,有q个询问,每次询问一个区间[l,r],这个区间的val就是所有数值为偶数个的数 ...

  4. css 内联与块

    内联元素可以理解为不能直接设置宽度和高度元素,比如span,你为他设置宽度和高度没有效果,除非你把它设置成块级元素. 如下面的代码把display:block;属性值去掉的话,宽度和高度都不会起作用了 ...

  5. C#入门经典-第15章ListBox,CheckedListBox

  6. 安卓图表引擎AChartEngine(六) - 框架源码结构图

    包结构: org.achartengine: org.achartengine.model: org.achartengine.renderer: org.achartengine.tools: 安卓 ...

  7. [ERROR] Fatal error: Can't open and lock privilege tables: Table 'mysql.user' doesn't exist 160913 02:11:21 mysqld_safe mysqld from pid file /tmp/mysql.pid ended

    -- :: [Note] InnoDB: Renaming log file ./ib_logfile101 to ./ib_logfile0 -- :: [Warning] InnoDB: New ...

  8. ICE第三篇------一些疑难点

    1 间接代理 参考http://blog.sina.com.cn/s/blog_53e8499c0100lkoo.html IceGrid用于支持分布式网络服务应用,一个IceGrid域由一个注册表( ...

  9. iReport使用教程

    http://www.blogjava.net/keweibo/articles/239492.html 原创出处 http://blog.163.com/liushuo216@126/blog/st ...

  10. MariaDB GTID 复制同步

    MariaDB GTID 复制同步 GTID:Global Transaction ID,全局事务ID,在整个主从复制架构中任何两个事物ID是不能相同的.全局事务ID是Mster服务器生成一个128位 ...