从 parent 捕获 iFrame onhashchange 事件

Question

我一直在尝试从他的 parent 中捕获 iFrame 的 onHashChange 事件，但没有成功。

基本上我在做：

index.html - 方法一：

iframeEl = document.getElementById('myiframeid');
iframeEl.addEventListener('hashchange', function() {
    alert('hash changed')
}, true);

index.html - 方法二：

iframeEl = document.getElementById('myiframeid');
iframeEl.onhashchange = function() {
    alert('hash changed')
};

无论如何，当我尝试从他的 parent 捕获 iframe 事件时，none 方法有效，尽管如果我尝试从 iframe 内部运行下面的代码：

window.addEventListener('hashchange', function() {
    alert('hash changed')
}, true);

或

window.onhashchange = function() {
    alert('hash changed')
};

两种方法都有效。

问题是：我需要从 iFrame 外部捕获 hashchange 事件。

有人知道如何处理吗？

仅供参考：jQuery 不是一个选项。

提前致谢。

Answer 1

假设您要从包含您的 <iframe>:

的页面测试 IframeElement.contentWindow 上的哈希更改

//<![CDATA[
// external.js - the page with your <iframe>
var doc, bod, htm, C, E, T; // for use on other loads
addEventListener('load', function(){ // window.onload sort of

doc = document; bod = doc.body; htm = doc.documentElement;
C = function(tag){
  return doc.createElement(tag);
}
E = function(id){
  return doc.getElementById(id);
}
T = function(tag){
  return doc.getElementsByTagName(tag);
}
var innerWindow = E('yourIframeId').contentWindow;
var oldHash = innerWindow.location.hash.replace(/#/, '');
innerWindow.addEventListener('hashchange', function(){
  console.log('#'+oldHash+' has been changed to #'+innerWindow.location.hash.replace(/#/, ''));
});

}); // end load
//]]>

从 parent 捕获 iFrame onhashchange 事件

Capture iFrame onhashchange event from the parent

html

javascript

iframe

events

hashchange