将值从窗口传递给iframe

我需要发送一个值到一个iframe。 iframe存在于当前窗口中。 我怎样才能做到这一点?

我需要在父(当前)窗口的JavaScript中做。

首先,您需要了解您有两个文档:框架和容器(包含框架)。

从容器操作框架的主要障碍是框架asynchronous加载。 你不能随时访问它,你必须知道什么时候它已经完成加载。 所以你需要一个技巧。 通常的解决scheme是在框架中使用window.parent来获取“up”(包含iframe标签的文档)。

现在你可以调用容器文档中的任何方法。 这个方法可以处理框架(例如用你需要的参数调用框架中的一些JavaScript)。 要知道何时调用该方法,您有两个select:

  1. 从框架的body.onload调用它。

  2. 将脚本元素作为最后一个东西放入框架的HTML内容中,在该框架中调用容器的方法(作为读者的练习)。

所以这个框架是这样的:

 <script> function init() { window.parent.setUpFrame(); return true; } function yourMethod(arg) { ... } </script> <body onload="init();">...</body> 

和这样的容器:

 <script> function setUpFrame() { var frame = window.frames['frame-id']; frame.yourMethod('hello'); } </script> <body><iframe name="frame-id" src="..."></iframe></body> 

取决于你的具体情况,但是如果iframe可以在页面加载的其余部分之后被部署,你可以简单地使用一个查询stringla:

 <iframe src="some_page.html?somedata=5&more=bacon"></iframe> 

然后在some_page.html某处:

 <script> var params = location.href.split('?')[1].split('&'); data = {}; for (x in params) { data[params[x].split('=')[0]] = params[x].split('=')[1]; } </script> 

使用帧集合 。

从链接:

 var frames = window.frames; // or // var frames = window.parent.frames; for (var i = 0; i < frames.length; i++) { // do something with each subframe as frames[i] frames[i].document.body.style.background = "red"; } 

如果iframe具有名称,则还可以执行以下操作:

 window.frames['ponies'].number_of_ponies = 7; 

你只能这样做,如果这两个页面是从同一个域提供的。

还有两个选项,这些选项并不是最优雅的,但可能更容易理解和实现,特别是iframe需要来自其父母的数据只是几个variables而不是复杂的对象:

使用url片段标识符(#)

在容器中:

 <iframe name="frame-id" src="http://url_to_iframe#dataToFrame"></iframe> 

在iFrame中:

 <script> var dataFromDocument = location.hash.replace(/#/, ""); alert(dataFromDocument); //alerts "dataToFrame" </script> 

使用iFrame的名称

(我不喜欢这个解决scheme – 滥用名称属性,但这是一个选项,所以我提到它的logging)

在容器中:

 <iframe name="dataToFrame" src="http://url_to_iframe"></iframe> 

在iFrame中:

 <script type="text/javascript"> alert(window.name); // alerts "dataToFrame" </script> 

这是另一种解决scheme,如果帧来自不同的域,则可以使用。

 var frame = /*the iframe DOM object*/; frame.contentWindow.postMessage({call:'sendValue', value: /*value*/}, /*frame domain url or '*'*/); 

而在框架本身:

 window.addEventListener('message', function(event) { var origin = event.origin || event.originalEvent.origin; // For Chrome, the origin property is in the event.originalEvent object. if (origin !== /*the container's domain url*/) return; if (typeof event.data == 'object' && event.data.call=='sendValue') { // Do something with event.data.value; } }, false); 

不过不知道哪些浏览器支持这一点。

看看下面的链接,这表明可以使用Javascript来改变页面内的iFrame的内容,尽pipe你很可能遇到一些跨浏览器的问题。 如果你可以做到这一点,你可以在你的页面中使用JavaScript来将隐藏的DOM元素添加到包含你的值的iFrame,iFrame可以读取。 访问iFrame内的文档

有两种方法


父母(C#)中的第一种方法打开会话

 Session["MYDATA"] = "Some Data"; 

并在IFRAME(C#)里面写下

 String x=Session["MYDATA"] 

问题:如果你有多个开放它可以混合和制造问题


第二种方式,问题较less,因为我知道在父母的Html内部添加结尾到您的源(src)

在我的框架的C#我把(在Page_Load内)

 String SourcePage = Request.QueryString["source_page"].ToString(); 

你得到(SourcePage = MYpage)

希望它能帮助你