将实时 jQuery 事件应用于 iframe 内容

applying live jquery events to iframe content

本文关键字：iframe 内容 应用于 事件 实时 jQuery      更新时间：2023-09-26

我正在尝试将实时点击事件应用于动态添加到可编辑的 iframe 的元素。

$('#iframeView').contents().find('*').on("click", function(e) {
    e.stopPropagation();
    e.preventDefault();
    selectItemElement($(this));
});

这可以将事件应用于 iframe 中的元素，但是如果我向 iframe 添加新元素，它们将不再获得单击事件。因此，它不应用实时事件。

知道如何让它工作吗？

您需要委托事件，这意味着将事件添加到静态容器。iFrame document将成为一个很好的静态容器，这就是使用.contents()会给你的。

如果事件的目标元素与您的选择器（.on() 的第二个参数）匹配，则将调用该函数。

$('#iframeView').contents().on("click",  '*', function (e) {
    e.stopPropagation();
    e.preventDefault();
    selectItemElement($(this));
});

JSFiddle

从文档中您可以使用：

$( selector ).live( events, data, handler );                // jQuery 1.3+
$( document ).delegate( selector, events, data, handler );  // jQuery 1.4.3+
$( document ).on( events, selector, data, handler );        // jQuery 1.7+

例如：

$('#iframeView').contents().on("click",'*',function (e) {
 //Your code here 
});
相关文章：