I have a page with a dynamic number of iframes. window.print() has to be called when iframes has loaded (ie. has src).
How can this be handled elegantly in pure JavaScript without being to pedantic?
2
-
Are the iframes all under your control? Or are some of them different domains that you do not control?jfriend00– jfriend002012-10-05 21:18:32 +00:00Commented Oct 5, 2012 at 21:18
-
It's from an outside source and not under my control.PHearst– PHearst2012-10-05 22:12:05 +00:00Commented Oct 5, 2012 at 22:12
Add a comment
|
3 Answers
function getLoadedFrames () {
var frames = document.getElementsByTagName( 'iframe' ), // Get all iframes
loadedFrames = [], i;
for ( i = 0; i < frames.length; i++ ) {
/*
If iframe has a src attribute, that attribute has a value AND
that value is not equal to the current window location (leaving src
blank seems to return the current location instead of empty string)
then add the frame to the loadedFrames array.
*/
if ( frames[ i ].src && frames[ i ].src.length > 0 && frames[ i ].src !== window.location.href ) {
loadedFrames.push( frames[ i ] );
}
}
return loadedFrames; // An array of your 'loaded' frames
}
Not quite sure if that's what you want, but perhaps it helps:
window.addEventListener("DOMContentLoaded", function(){
// Get all iframes as soon as DOM has loaded
var iframes = document.getElementsByTagName("iframe");
for (var i = 0, l = iframes.length; i < l; ++i) {
// Add event handler to every iframe
iframes[i].onload = function(){
// Execute window.print() when iframe has loaded
window.print();
};
}
});
This works without checking the src attribute, because if a iframe doesn't have a src, the onload event will never be fired.
Note that this won't work in IE; see this answer on SO for an equivalent to jQuery's $(document).ready...
3 Comments
PHearst
Thanks, but to support IE, it gets kind of pedantic ;-)
PHearst
But in general cases, it's better checking the onload, as I'll have to add some additional loadtime is required for each iframe even though it has src.
Aletheios
Those were my thoughts too. Perhaps you should consider being a bit pedantic in this case... ;)
You could do
function areAllIframesLoaded() {
var frames = document.getElementsByTagName( 'iframe' )
return Array.prototype.slice.call(frames).reduce(function(p, c) {
return p && c.src && c.src.length > 0 && c.src !== window.location.href
}, true);
}
This will iterate over all the iframes and return true or false on whether or not all of them have a src defined.
3 Comments
Kevin Boucher
frames.reduce returns an error in Fx 15? "Error: TypeError: frames.reduce is not a function"
Kevin Boucher
Apparently not, but it is Firefox 15.0.1.
saml
Durr, I needed to use Array.prototype.slice first. Fixed