Loading javascript file asynchronously

Question

I am trying to make an asynchronous call to a server in the following way

$(document).ready(function(){
    $.ajax({
    cache: true,
        async: true,
        dataType: "script",
        url:"www.xyz.com/yyy?host_name=abc.com&amp;size=S&amp;use_flash=YES&amp;use_transparent=YES&amp;lang=en",
       success: function(data) { 
            $("#verified").append(data);
                console.log("data is "+data);
                loading = false; 
            } 
       });
});

However the script is not being loaded asynchronously.What exactly am I missing? Any help would be appreciated!

You're missing success to retrieve response from the server! — Dhaval Marthak
– Dhaval Marthak, Commented Dec 29, 2013 at 6:35
Also, do you see the request happen in the Chrome/Firefox Inspector's Network panel? By the way, you shouldn't use HTML encodings for special characters ("&") in javascript. — tdooner
– tdooner, Commented Dec 29, 2013 at 6:36

Tony · Accepted Answer · 2013-12-30 07:19:40Z

3

Try jQuery.getScript function.

answered Dec 30, 2013 at 7:19

Tony

7,4453 gold badges28 silver badges34 bronze badges

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

1 Comment

GoAntonio Over a year ago

yeah so much better than using plane javascript if you can afford it it has easier error handling for the uninitialized

Kamlesh · Accepted Answer · 2013-12-29 06:43:53Z

3

Use Following function for loading javascript asynchronous

 function script(url) {
        var scriptObject = document.createElement('script');
        scriptObject .type = 'text/javascript';
        scriptObject .async = true;
        scriptObject .src = url;
        document.getElementsByTagName('head')[0].appendChild(scriptObject );            
    }

answered Dec 29, 2013 at 6:43

Kamlesh

5291 gold badge8 silver badges19 bronze badges

1 Comment

Smrita Over a year ago

Hey thanks I already tried loading javascript file as you've suggested however it doesnot work as in my page takes a lot of time while loading script from the server and only after it loads other .js files are being loaded.Any idea why ?

Rahul · Accepted Answer · 2013-12-30 07:47:45Z

The "cache" and "async" properties for ajax call have the values "true" by default, you don't have to specify the defaults again.

You mentioned that it takes time for your file to load, that is probably because that the script file you are trying to load is of ample size. By ample size I mean more than 50 or 100 kb.

To reduce the time it takes for your file to load you can minify your js file which will help you reduce the file size of your script and eventually load faster on ajax call.

http://jscompress.com is one of the good on-line minifier available.

Alternatively, you can try using requirejs library which is widely used for loading script files asynchronously. You can download the requirejs library from the following link: http://requirejs.org/docs/download.html

Collectives™ on Stack Overflow

Loading javascript file asynchronously

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related