如何检测 iframe 的来源何时更改？答案

【问题标题】：How can I detect when source of iframe is changed?如何检测 iframe 的来源何时更改？
【发布时间】：2010-07-02 02:47:36
【问题描述】：

我想检测用户何时单击iframe 中的链接并更改iframe 的来源，因为我想调整它的大小。我也使用 jQuery。检测这种情况的最佳方法是什么？

其实我需要这样的东西（这个例子是在jQuery中的，它不起作用，我想象的这个）

$('#iframe').live('load', function(){ alert('src is changed')});

【问题讨论】：

iframe 是指向同一个域还是另一个域？
同一个域，但可能是另一个子域。

标签： javascript jquery html iframe

【解决方案1】：

您可能想要使用onLoad 事件，如下例所示：

<iframe src="/test.html" onLoad="alert(this.contentWindow.location);"></iframe>

只要 iframe 中的位置发生变化，就会弹出警报。它适用于所有现代浏览器，但可能不适用于一些非常旧的浏览器，如 IE5 和早期的 Opera。 (Source)

请注意，如果 iframe 位于不同的域或子域中，您将无法访问 contentWindow.location，但仍会触发 onLoad 事件。

【讨论】：

是的，它会的。有问题吗？
是的，我猜How can I detect when source ` 的 iframe 已更改？`
@Reigel：如果 iframe 指向同一域内的页面，OP 可以检查 this.contentWindow.location 以查看 iframe 是否指向新的 scr。如果刷新 iframe，onLoad 仍将触发，但 this.contentWindow.location 将设置为与以前相同的值。这应该很容易检查。
这不起作用... ff 表示执行时权限被拒绝

【解决方案2】：

这不是一个完全干净的解决方案，但它会起作用：您可以创建一个计时器来定期检查 iframe 源是否已更改。

var prevSrc = '';
function check() {
  var curSrc = $('#iframe').attr('src');
  if (curSrc != prevSrc) {
    // source has changed; do something
    prevSrc = curSrc;
  }
}

window.setInterval(check, 1000); // 1 sec - this can be anything you want

【讨论】：

@casablanca：即使 iframe 从 iframe 本身的链接导航到新页面，您知道这是否有效？
@Daniel Vassallo 不，它不会因为“src”不会改变。
NB:curSrc != prevSrc 将在第一次触发时为真，因为 prevSrc 将是 null vs iframe src。
@casablanca, @Ozaki：我认为 OP 要求在用户从 iframe 内导航时触发一个事件："I want to detect when user clicks a link in iframe"。
@stormdrain：确实如此。如果不需要，只需将prevSrc 设置为原始来源。 @Daniel：我猜你是对的，这导致你使用contentWindow.location 而不是src 的解决方案。