使用jQuery委托捕获iframe的加载事件

Question

我希望能够捕获在加载页面后某个时刻添加到文档中的任何iframe的load事件。我尝试使用on("load", "iframe", fn)，但貌似行不通：

function addIframe() {
  $("<iframe src='https://example.com'>").appendTo($("body"))
}

// This does not work
$(document).on("load", "iframe", function() {
  alert("loaded, caught via delegation")
})

setTimeout(function() {
  addIframe()
  // This works
  $("iframe").on("load", function() {
    alert("Loaded, caught via direct selection")
  })
}, 1000)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

当使用$("iframe").on("load", fn)时，在添加iframe后立即执行，对于document的委托无效。

如何通过委托来检测页面中的任何iframe加载？

- Ionică Bizău

---

一个 iframe 不同于一个 img，但是那里描述的解决方案在你的情况下同样适用。 - CertainPerformance

@CertainPerformance 很有趣，这个方法可行！谢谢！但是，如果用jQuery的方式会怎么样呢？我在这里尝试了一下（http://jsfiddle.net/w27yn1go/6/）。 - Ionică Bizău

我谷歌搜索了“jquery usecapture”，并找到了https://dev59.com/OGAf5IYBdhLWcg3wey3Z。看起来在jQuery中似乎不可能，必须使用“addEventListener”？ - CertainPerformance

@CertainPerformance 是啊...我也发现了。无论如何，addEventListener 似乎可行！谢谢！ - Ionică Bizău

Answer 1

如何使用委托方式检测页面中的 iframe 加载事件？

不幸的是，无法通过 jQuery 委托捕获 iframe 加载事件。

- GhitaB

---

这是不可能的，因为LOAD事件不会冒泡。 - NoSkill