将事件绑定到动态创建的 iframe 元素

Posted 2023-05-09

【中文标题】将事件绑定到动态创建的 iframe 元素

【英文标题】：bind event to dynamically created iframe element

【发布时间】：2014-10-15 05:32:40

【问题描述】：

我想将事件侦听器绑定到 DOM 中尚不存在的元素。现在这将是 jQuery.on() 的情况。

但在这种情况下，我必须将事件绑定到 iFrame 中的元素。这可以由

管理

$("#iFrame").contents().find(".my_element").bind(...

等等。但是我的情况是，该元素尚未出现在 iFrame-Document 中（它是由用户交互添加的），因此 .find() 将返回一个空数组并且该事件不会被绑定。

是否甚至可以将事件侦听器绑定到稍后创建的 iFrame 特定元素？我只找到现有元素的解决方案，体育内容（）和查找（）。

提前致谢！

【问题讨论】：

我会将事件更改或准备好分配给 iframe，在回调中我会尝试像您写的那样分配。

所以您想将事件绑定到尚不存在的元素？为什么？

【参考方案1】：

试试这个

$("#iframe").load(function()
    $("#iFrame").contents().find(".my_element").bind('click',function()
       // Your code here
    );
);

希望这会有所帮助.. 干杯..

【讨论】：

也许我没有正确描述我的问题。该元素是通过另一个用户输入创建的，因此它永远不会自动出现在 DOM 中。所以 'find' 永远不会返回任何东西。

【参考方案2】：

我找到了一个行之有效的解决方案。如果这不起作用，只需通过alert( $("#iframe").length ); 检查 iframe 是否存在。值必须大于 0。

$("#iframe").contents().find('body').on("click", ".my_element", function (e)

    alert("Give it to me dude ;)");
);