jQuery getScript call function when script is loaded

Question

Here is the script:

$("#button").click(function(){
    $.getScript('script.js', function(){
       script.init();
    });
});

I want to be able to run script.init() like the above example, but if I do it like this, I have to click the button twice to be able to get the script. -When it runs script.init() the first time, it is not loaded yet it seems.

So how can I make sure the script is loaded before I do something with it?

Arm0geddon · Accepted Answer · 2012-06-11 23:46:19Z

3

Try this:

$(window).load(function() {
    $.getScript('script.js', function() {
        $("#button").click(function() {
           script.init();
        });
    });
});

Or, try using the jQuery.ajax function instead of the shorthand:

$("#button").click(function () {
    $.ajax({
        url: "script.js",
        dataType: "script",
        success: function () { script.init(); }
    });
});

edited Jun 11, 2012 at 23:46

answered Jun 11, 2012 at 23:31

Arm0geddon

48411 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

user1121487 Over a year ago

Yes I'm sure that will work, but I don't want to load the script until it is needed.

user1121487 Over a year ago

The second solution does the same thing... Button needs to be pressed twice. If I put it in a setTimeout it will work, but that is not the solution I want.

user1121487 Over a year ago

Solved. The script.js had a $(function(){ script.init()}; at bottom of the page, this seemed to interfere with the script. Removed, and now works!

user1658136 Over a year ago

Good job on the answer with ajax... There's success but also error, for function callback.

Steve Putala · Accepted Answer · 2013-08-26 18:05:51Z

0

I have used this code to call the function when the function name is a string.

$.ajax({
    url: 'script.js',
    dataType: "script",
    success: function () { window["script"]["init"](); }
});

You could also pass the button into the function that you are calling.

$.ajax({
    url: 'scrpt.js',
    dataType: "script",
    context : this,
    success: function () { window["script"]["init"](this); }
});

edited Aug 26, 2013 at 18:05

answered Aug 26, 2013 at 17:54

Steve Putala

1812 silver badges5 bronze badges

Collectives™ on Stack Overflow

jQuery getScript call function when script is loaded

2 Answers 2

4 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Related