Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

passing in javascript values into iframe tag

What's the best way to pass in the value held in a javascript variable into an iframe call on the same html page? I'm trying to improve my site's page response times by moving ad serving javascript code (the typical document.write('<script type="text/javascript" src="..") into a separate iframe. (Based on this posting)

The request to the ad server typically require a seed variable declared once per site and incremented each time page is loaded by the client. What I want to do is pass in the seed variable into the document invoked by my iframe section.

The seed variable is initialized in the 'head' tag of my main html document:

<head>
    <script type="text/javascript">
    <!--
    custom_seed=1;  
    //-->
    </script>
</head>

Later in the html document, I make the request through an iframe which returns the html necessary to invoke the ad server.

<body>
<!-- a bunch of html to display the page -->
<iframe src="somepage.html" width="100%" height="100%">
<p>No support for iframe</p>
</iframe>
</body>

The html returned in the 'somepage.html' has a script used to call the ad server and needs to use the earlier declared seed variable as a parameter:

<script type="text/javascript">
    document.write('<script type="text/javascript" src="http://ad.server.net/...seed='+ custom_seed  +'?"></script>');
    custom_seed++;
    </script>

What's a good way to achieve this?

like image 466
Cedar Jensen Avatar asked Apr 12 '10 21:04

Cedar Jensen


People also ask

Can we pass parameters to iframe?

You can use a script to get the desired parameter value from parameters passed to page. Show activity on this post. If you have slightly more control on your iframe sandbox, you can try postMessage API to communicate with message on events you desire to trigger.

Can an iframe run JavaScript?

Calling a parent JS function from iframe is possible, but only when both the parent and the page loaded in the iframe are from same domain i.e. example.com , and both are using same protocol i.e. both are either on http:// or https:// .


1 Answers

The only way you can pass values directly to an iframe of a page with a different domain is through the url, as querystring values, anchors, or perhaps some form of rewriting. Even if it's on the same domain, that's probably the easiest and safest way to pass it.

Main document:

document.getElementById('IframeID').src = "somepage.html?seed=" + custom_seed;

Inner document:

var seed = window.location.search.substring(window.location.search.indexOf('seed=') + 5);
if (seed.indexOf('&') >= 0) {
    seed = seed.substring(0, seed.indexOf('&'));
}
like image 151
tloflin Avatar answered Sep 20 '22 16:09

tloflin