Problem loading remote script with jQuery multiple times in Firefox

Question

Hi!

I have a script element in my webpage, something like this:

<script id="myscript"></script>

Now, from a javascript file, I'm doing something like the following:

$('#myscript').src('http://foo.bar?callback=somefunc')

Now this remote script 'returns javascript' of the following form:

somefunc(somearg);

When I run all of this, things work neatly, the script gets loaded dynamically, and the 'somefunc' callback is executed.

The problem happens when I do the same thing again. Let's say I again call the same thing:

$('#myscript').src('http://foo.bar?callback=somefunc')

This, for some reason, DOESNT return the javascript call in Firefox only. (Works fine in IE - somefunc gets executed again as expected).

I can think of ugly workarounds (such as doing a $('head').append('<script...')) every time - but I'd like to know what's going on here.

Thanks in advance!

Answer 1

I would recommend you to use $.getScript instead of using a single script tag load scripts multiple times:

$.getScript("http://foo.bar?callback=somefunc");

That function will abstract the script element creation and its introduction to the DOM.

But it seems you are accessing a JSONP service, in that case you need only $.getJSON:

$.getJSON("http://foo.bar?callback=?", function(json){
  // callback
});