(Reliably) calling a function from a dynamically loaded script

[sfeher]

Hi,

Is there a way to know when a function is available for me to call it
from a dynamically loaded a javascript?

I use this code to load the include.js file and then I call
testIncludeFn() from it:

<code>

var html_doc = document.getElementsByTagName('head').item(0);

var file = document.createElement('script');
file.setAttribute('language','javascript');
file.setAttribute('type','text/javascript');
file.setAttribute('src','/include.js');
html_doc.appendChild(file);

// here I would like to be able to wait for the script to become
available

testIncludeFn();

</code>

It works in IE and sometimes I get it to work in FF 1.5, but I would
like to have a way of reliably calling testIncludeFn().
Can I pool somehow the DOM to see if the load completed. How?

Is there a better approach to it?

Regards,

Sebastian

[Martin Honnen]

sf****@gmail.com wrote:

Is there a way to know when a function is available for me to call it
from a dynamically loaded a javascript? Can I pool somehow the DOM to see if the load completed. How?

Mozilla (and Opera 9 beta) supports e.g.
var script = document.createElement('script');
script.addEventListener(
'load',
function (evt) {
// handle load here e.g. call whatever function you want to call
functionName();
},
false
)
script.type = 'text/javascript';
script.src = 'file.js';
// now append script element into the document tree so that the script
// file is loaded and executed
document.getElementsByTagName('head')[0].appendChild(script);

--

Martin Honnen
http://JavaScript.FAQTs.com/

[sfeher]

Martin Honnen wrote:

var script = document.createElement('script');
script.addEventListener(
'load',
function (evt) {
// handle load here e.g. call whatever function you want to call
functionName();
},
false
)

Thanks Martin, it works great! and it's really simple this way.

IE6 seems to be a different story though.
I tried both the equivalent with attachEvent('onload' ... and
YAHOO.util.Event.addListener( script,'load',callback);
I'm not getting any error but IE doesn't seem to react to load on the
script tag.

Any idea how to get around it?

Regards,
Sebastian

[the DtTvB]

[e-mail] wrote:

IE6 seems to be a different story though.
I tried both the equivalent with attachEvent('onload' ... and
YAHOO.util.Event.addListener( script,'load',callback);
I'm not getting any error but IE doesn't seem to react to load on the
script tag.

I would use.
var script = document.createElement('script');
script.onload = function(e) {
functionName();
};
script.src = '......';

Still works fine on Mozilla.
Not sure on Internet Explorer, but in JS reference, it said it was
available since IE4.

[sfeher]

the DtTvB wrote:

[e-mail] wrote:

IE6 seems to be a different story though.
I tried both the equivalent with attachEvent('onload' ... and
YAHOO.util.Event.addListener( script,'load',callback);
I'm not getting any error but IE doesn't seem to react to load on the
script tag.

I would use.
var script = document.createElement('script');
script.onload = function(e) {
functionName();
};
script.src = '......';

Still works fine on Mozilla.
Not sure on Internet Explorer, but in JS reference, it said it was
available since IE4.

I've tried that before and it didn't work for me. One thing that did
work though was using "onreadystatechange" instead.

Thanks,
Sebastian

[sfeher]

the DtTvB wrote:

[e-mail] wrote:

IE6 seems to be a different story though.
I tried both the equivalent with attachEvent('onload' ... and
YAHOO.util.Event.addListener( script,'load',callback);
I'm not getting any error but IE doesn't seem to react to load on the
script tag.

I would use.
var script = document.createElement('script');
script.onload = function(e) {
functionName();
};
script.src = '......';

Still works fine on Mozilla.
Not sure on Internet Explorer, but in JS reference, it said it was
available since IE4.

It does work if you declare both:

script.onload = script.onreadystatechange = function(){
alert("onLoad"); };

Regards,
Sebastian