jquery - 动态 .load()ed 元素不可查询

Question

我有一个主 html 文件和一些存储在外部 html 文件中的iframe元素，这些元素仅在用户单击导航器的按钮之一后按需加载。

$('#carousel_01').load('content_01.html');

每个iframe 的* src * 属性都指向一个 Vimeo 视频。对于每个 Vimeo 视频，我附加了一个事件监听器函数，该函数监视视频的状态并触发主 html 文档（主要是 div 动画）中的某个动作。

问题是：将外部 iframe 加载到主 html 文件后，它没有注册为文档本身的一部分。如果我使用查询主 html 文档中的所有 iframe

var vimeoPlayers = document.querySelectorAll('iframe'), player;

仅返回以前加载的 iframe。动态加载的不在列表中（同时仍在主页上显示和可见）。由于无法查询加载的 iframe，我无法将事件侦听器附加到视频。如何强制更新主 html 文档，以便它识别导入（加载）的 iframe？

score 1 · Accepted Answer

由于 AJAX 是异步的，所以需要在回调函数中更新变量：

$('#carousel_01').load('content_01.html', function() {
    vimeoPlayers = document.querySelectorAll('iframe');
});

1 回答 1