<!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. Ubuntu系统如何修改主机名

    1.执行命令 hostname temp_name 这样主机名就改掉了.只不过重启后名字会恢复不一定使我们想要的.机器重启后会重新去读取/etc/hostname里面存储的主机名.所以如果想永久改掉的 ...

  2. css一些特别效果设定

    在CSS中,BOX的Padding属性的数值赋予顺序为 padding:10px; 四个内边距都是10pxpadding:5px 10px; 上下5px 左右10pxpadding:5px 10px ...

  3. c# winform 点击按钮切换tabcontrol标签

    this.tabControl1.TabPages.Remove(tabPage1); this.tabControl1.TabPages.Remove(tabPage2); this.tabCont ...

  4. 25个最佳最闪亮的Eclipse开发项目

    http://blog.csdn.net/howareyoutodayyhz/article/details/8264599 25个最佳最闪亮的Eclipse开发项目 标签: eclipseEclip ...

  5. Linux：系统的基本优化

    前言,在拥有一台服务器的时候,首先第一件事就要根据自己的需求进行初期的优化(装好系统了),以下是关于linux系统的基本优化,内容来源与网络,自己整理了以下,忘记来自哪个网址了, centos 系统优 ...

  6. CodeForces 616D Longest k-Good Segment

    用队列维护一下即可 #include<cstdio> #include<cstring> #include<queue> #include<algorithm ...

  7. 想要学习Linux技术，先好好的读一本Linux书籍吧

    忘记你在使用windows时的使用习惯和使用思维.学习Linux,一定要适应Linux的命令行界面,因为命令行才是Linux的真正魅力所在,而X-window或着说桌面环境也只是运行在命令行模式下的一 ...

  8. h2database. 官方文档

    http://www.h2database.com/html/advanced.html http://www.h2database.com/html/tutorial.html#csv http:/ ...

  9. oracle 函数的创建和调用

    以下已经测试通过 创建函数: create or replace function get_annual_sal(in_name varchar2) return number is annual_s ...

  10. 【转贴】 Flex 预编译处理 与 手机项目、Web项目、Air项目自由转换

    原文连接: http://bbs.9ria.com/forum.php?mod=viewthread&tid=263350#lastpost 由于这个论坛不稳定,所以转到这里来,这个帖子蛮有用 ...