Javascript 将事件处理程序附加到IFrame中呈现的HTML

我正在设计一个react应用程序，该应用程序将用于查看来自已知源的多种不同类型的文件。用户将进行搜索，并显示结果列表，然后单击其中一个结果，我将获取文件，并希望在屏幕上显示它。这些文件都是HTML/XML

除此之外，我希望将事件处理程序附加到文件本身中的某些标记。（例如，将

onClick

侦听器附加到所有

标记）

---

显而易见的答案是使用iframe，但是事件处理程序会成为一个问题。使用

危险的LysetinerHTML

也可以，但是如果有更好的解决方案，我很想知道。有什么想法吗？

您可以从iframe触发事件，并使用此代码由其父级处理

//iframe
function buttonClick() {
  parent.$(parent.document).trigger('eventhandler');
}
<button onclick="buttonClick()">Button</button>

//parent
 $(document).on('eventhandler', function () {
     alert('event fired');
 });

//iframe
函数按钮单击（）{
父.$（parent.document）.trigger（'eventhandler'）；
}
按钮
//母公司
$（文档）.on（'eventhandler'，函数（）{
警报（“触发事件”）；
});

只需在父文件中添加事件处理程序，并在其中添加您的逻辑，然后在子iframe文件中添加事件触发器，或者您也可以执行以下操作