window属性：onhashchange
onhashchange属性
当窗口的哈希值发生变化时，hashchange事件将会触发。
onhashchange属性语法
window.onhashchange = funcRef;或者：
<body onhashchange =“funcRef（）;”>覆盖任何现有的事件处理程序。
为了将事件侦听器添加到现有的事件处理程序集，请使用函数“addEventListener”：
window.addEventListener（“hashchange”，funcRef，false）;onhashchange属性参数
funcRef- 对函数的引用。
onhashchange属性示例
if ("onhashchange" in window) {
alert("The browser supports the hashchange event!");
}
function locationHashChanged() {
if (location.hash === "#somecoolfeature") {
somecoolfeature();
}
}
window.onhashchange = locationHashChanged;hashchange事件
触发的hashchange事件具有以下字段：
| 字段 | 类型 | 描述 |
newURL
|
DOMString
|
窗口正在导航到的新URL |
oldURL
|
DOMString
|
导航窗口的上一个URL |
针对event.newURL和event.oldURL的解决方法
//let this snippet run before your hashchange event binding code
if(!window.HashChangeEvent)(function(){
var lastURL=document.URL;
window.addEventListener("hashchange",function(event){
Object.defineProperty(event,"oldURL",{enumerable:true,configurable:true,value:lastURL});
Object.defineProperty(event,"newURL",{enumerable:true,configurable:true,value:document.URL});
lastURL=document.URL;
});
}());规范
| 规范 | 状态 | 注释 |
|---|---|---|
|
HTML Living Standard
该规范中的'GlobalEventHandlers'的定义。
|
Living Standard |
|
|
HTML 5.1
该规范中的'GlobalEventHandlers'的定义。
|
Recommendation
|
|
|
HTML5
该规范中的'GlobalEventHandlers'的定义。
|
Recommendation
|
浏览器兼容性
| 电脑端 | 移动端 | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome
|
Edge
|
Firefox
|
Internet Explorer
|
Opera
|
Safari
|
Androidwebview
|
Chrome for Android
|
Edge Mobile | Firefox for Android
|
Opera for Android
|
iOS Safari | |
| 基本支持 | 支持 | 支持 | 支持：3.6 | 支持：8 | 支持：10 | 支持：5 | 支持 | 支持 | 支持 | 支持：4 | 支持：11 | 支持：5 |