Databases
StackOverflow2013
Postsdbo
POCan't change iframes onload listener in IE9
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POCan't change iframes onload listener in IE9
    text
    copied!<p>I have the following code within an external javascript file.</p> <pre><code>jQuery(function ($) { //////////////////////UPCOMING EVENTS JSON SERVER START/////////////////////////// var eventList = $("#eventList"); //cache the element $.getJSON("/JsonControl/Events.json", function (jsonObj) { val = ""; for (var i = 0; i &lt; jsonObj.events.length; ++i) { val += "&lt;p&gt;" + jsonObj.events[i].dateMonth + "/" + jsonObj.events[i].dateNumber + "/" + jsonObj.events[i].dateYear + " - &lt;span id='EL" + i + "' class='link' " + "onclick=plotEvent(" + i +")&gt;" + jsonObj.events[i].title + "&lt;/span&gt;&lt;/p&gt;"; } eventList.html(val); }); //////////////////////UPCOMING EVENTS JSON SERVER END///////////////////////////// }); function plotEvent(index) { $.ajax({ url: "/JsonControl/Events.json", dataType: 'json', async: false, success: function (jsonObj) { var eventBox = window.frameElement; alert("This alert fires in all browsers, including IE9") eventBox.onload = function () { alert("This alert doesn't fire in IE9.") window.frameElement.onload = null; // unset it so it only fires once eventBox = eventBox.contentDocument || eventBox.contentWindow.document; eventBox.getElementById("title").innerHTML = (jsonObj.events[index].title); eventBox.getElementById("content").innerHTML = (jsonObj.events[index].explanation); eventBox.getElementById("dateHolder").innerHTML = (jsonObj.events[index].dateMonth + "-" + jsonObj.events[index].dateNumber + "-" + jsonObj.events[index].dateYear); }; eventBox.src="/Event htms/Event.htm"; } }); } </code></pre> <p>The page that loads this script is in the iframe itself. A very similar function called in a different external js file, from the main page outside of the iframe (for a different but similar purpose) works in all browsers just fine. The only difference is that with this code I have to target the onload of the iframe from within the iframe, instead of just grabbing the iframe by id. I then attempt to change, the onload of said iframe, for use with the next internal iframe page (which is why I need to preserve the json array index [i] when dynamically writing the first iframe page's innerHTML.</p> <p>Sorry if that was a bit wordy, and/or confusing, but suffice it to say that with using the above-pasted code, I have no problems... except with IE (tried in IE9). I have tried dozens of examples and supposed solutions, but nothing has worked. Using IE9.</p> <p>Here's what I mean when I say 'it doesn't work in IE9':</p> <p>This part of the code within plotEvent() doesn't fire:</p> <pre><code>eventBox.onload = function () { alert("This alert doesn't fire in IE9.") window.frameElement.onload = null; // unset it so it only fires once eventBox = eventBox.contentDocument || eventBox.contentWindow.document; eventBox.getElementById("title").innerHTML = (jsonObj.events[index].title); eventBox.getElementById("content").innerHTML = (jsonObj.events[index].explanation); eventBox.getElementById("dateHolder").innerHTML = (jsonObj.events[index].dateMonth + "-" + jsonObj.events[index].dateNumber + "-" + jsonObj.events[index].dateYear); }; </code></pre> <p>Is there any solution to this problem, or is this sort of thing why iframes aren't used more often (that is, that IE doesn't fully support them)?</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload