Pass value to iframe from a window

2楼-- · 2019-01-04 22:24

From the link:

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";
}

If the iframe has a name you may also do the following:

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

You can only do this if the two pages are served from the same domain.

0人赞添加讨论(0) 举报

趁早两清

3楼-- · 2019-01-04 22:26

Have a look at the link below, which suggests it is possible to alter the contents of an iFrame within your page with Javascript, although you are most likely to run into a few cross browser issues. If you can do this you can use the javascript in your page to add hidden dom elements to the iFrame containing your values, which the iFrame can read. Accessing the document inside an iFrame

0人赞添加讨论(0) 举报

老娘就宠你

4楼-- · 2019-01-04 22:35

First, you need to understand that you have two documents: The frame and the container (which contains the frame).

The main obstacle with manipulating the frame from the container is that the frame loads asynchronously. You can't simply access it any time, you must know when it has finished loading. So you need a trick. The usual solution is to use window.parent in the frame to get "up" (into the document which contains the iframe tag).

Now you can call any method in the container document. This method can manipulate the frame (for example call some JavaScript in the frame with the parameters you need). To know when to call the method, you have two options:

Call it from body.onload of the frame.
Put a script element as the last thing into the HTML content of the frame where you call the method of the container (left as an exercise for the reader).

So the frame looks like this:

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

And the container like this:

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

0人赞添加讨论(0) 举报

霸刀☆藐视天下

5楼-- · 2019-01-04 22:36

Here's another solution, usable if the frames are from different domains.

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

And in the frame itself:

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);

Don't know which browsers support this, though.

0人赞添加讨论(0) 举报

Explosion°爆炸

6楼-- · 2019-01-04 22:43

Two more options, which are not the most elegant but probably easier to understand and implement, especially in case the data that the iframe needs from its parent is just a few vars, not complex objects:

Using the URL Fragment Identifier (#)

In the container:

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

In the iFrame:

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

Use the iFrame's name

(I don't like this solution - it's abusing the name attribute, but it's an option so I'm mentioning it for the record)

In the container:

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

In the iFrame:

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

0人赞添加讨论(0) 举报

Viruses.

7楼-- · 2019-01-04 22:44

Depends on your specific situation, but if the iframe can be deployed after the rest of the page's loading, you can simply use a query string, a la:

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

And then somewhere in 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>

0人赞添加讨论(0) 举报

Pass value to iframe from a window

采纳回答

编辑标签

举报内容

检举类型

检举原因

检举说明(必填)

打开微信“扫一扫”，打开网页后点击屏幕右上角分享按钮

付费偷看金额在0.1-10元之间