javascript - 如何解析框架集中页面之间调用的 URL？

Question

我有一个 2 框架 HTML 页面:

• FrameA 包含指向各个页面的链接列表或页面内的 anchor
• FrameB 显示各个页面。

某些页面包含带有触发文本的幻灯片部分 - 即单击此文本将显示/隐藏其下方的幻灯片部分。

触发元素的父元素还包含 anchor ，例如:


<li class="expandable"><br/>
  <p><a name="myanchor3"></a>Trigger text</p><br/>
  <div class="slideDownSection"><br/>
       ...<br/>
  </div><br/>
</li>


我想检测何时在用于将页面加载到 FrameB 的 URL 中请求 anchor 。如果有 anchor 引用，我想检查 anchor 是否落在“可扩展”元素内，如果是，我在下面的元素上进行滑动以显示它。

我可以通过将一些 Javascript 放入 $(document).ready(function(){ ... }); 中来轻松完成此操作在加载的页面中。这会检查 location.hash 值，如果找到则对其进行处理。但是，这仅在页面加载到 FrameB 中时有效。

如果页面已加载到 FrameB 中，并且我单击 FrameA 中指向同一页面内另一个 anchor 的链接，则我无法捕获该事件。页面位置更改以在页面顶部或附近显示 anchor - 无需重新加载页面。

我的问题是:
我可以在 FrameB 中显示的页面中使用什么事件处理程序来检测是否通过在 FrameA 中单击的链接请求了该页面上的 anchor ？

注意:FrameA 的内容是自动生成的，因此我无法对 FrameA 中的页面使用 onClick 事件，我只能在 FrameB 中显示的页面中工作。

Answer 1

IE8 支持您可以监听的 hashchange 事件。对于所有其他浏览器，您必须使用 setInterval() 轮询 location.hash 的值:

var lastHash = null;
function checkHash() {
  if (window.location.hash != lastHash) {
    lastHash = window.location.hash;

    // Do your hash stuff
  }
}

setInterval(checkHash, 100);

On - window.location.hash - Change?是一个非常相似的问题。