从JavaScript / ASP.net MVC中的单独iFrame中刷新Div [英] Refresh Div from Within Separate iFrame in JavaScript/ASP.net MVC

问题描述

我有一个包含上传表单的iFrame。成功上传后，我需要控制器（或iFrame视图）刷新iFrame外部的DIV。怎么做到这一点？我在iFrame视图中尝试了这个，它在上传后重新加载，没有任何反应：

I have an iFrame that contains an upload form. Upon successful upload, I need the controller (or the iFrame view) to refresh a DIV that's outside the iFrame. How to accomplish this? I tried this in the iFrame view, which gets reloaded after upload, and nothing happens:

 document.getElementById('reportContainer').contentDocument.location.reload(true);

推荐答案

如果您控制父母的代码，那么我建议去寻找酒吧/子解决方案。

If you control the code of the parent then i recommend to go for a pub / sub solution.

iFrame 将触发父母的自定义事件。 >
当事件被触发时，父母将对目标 div 采取行动。

The iFrame will trigger a custom event to the parent.
The parent will act on the target div when the event is triggered.

iFrame 代码：

var myCustomEventData = { foo: 'bar' } // optional if you need to pass data
var myEvent = new CustomEvent('myEvent', { detail: myCustomEventData });
window.parent.document.dispatchEvent(myEvent);

父代码：

window.document.addEventListener('myEvent', handleEvent, false)
function handleEvent(e) {
  console.log(e.detail) // logs: {foo: 'bar'}
}

这篇关于从JavaScript / ASP.net MVC中的单独iFrame中刷新Div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！