将值从窗口传递给iframe
我需要发送一个值到一个iframe。 iframe存在于当前窗口中。 我怎样才能做到这一点?
我需要在父(当前)窗口的JavaScript中做。
首先,您需要了解您有两个文档:框架和容器(包含框架)。
从容器操作框架的主要障碍是框架asynchronous加载。 你不能随时访问它,你必须知道什么时候它已经完成加载。 所以你需要一个技巧。 通常的解决scheme是在框架中使用window.parent
来获取“up”(包含iframe
标签的文档)。
现在你可以调用容器文档中的任何方法。 这个方法可以处理框架(例如,用你需要的参数调用框架中的一些JavaScript)。 要知道何时调用该方法,您有两个select:
-
从框架的body.onload调用它。
-
将脚本元素作为最后一个东西放入框架的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)
希望它能帮助你