Home > DeveloperSection > Forums > Can I dyamically load multiple scripts by order
Manoj Bhatt
Manoj Bhatt

Total Post:153

Points:1079
Posted on    February-01-2015 10:22 PM

 JavaScript JQuery 
Ratings:


 1 Reply(s)
 481  View(s)
Rate this:

I'm lazy loading various scripts depending on what page I'm on. Up till now, I've only loaded one per page. Now that I'm starting to clean up and reduce the number of scripts, I have to lazy load two scripts (or more) scripts for the same page. One script is dependent of the other so I need to load these in correct order.

What is the best way to achieve this?

My code:

// Plupload must load before imageHandling.js

jQuery(document).ready(function() {

    //Conditional load

    load_script('.image-drop-box','vendor/plupload/plupload.full.min.js');

    load_script('.image-drop-box','imageHandling.js');

 

});

 

 

// Script loader

// .exists() is a custom func that checks if an element exists on page

function load_script(element, js) {

    $(element).exists(function(){

        var script = document.createElement('script');

        var footer = document.getElementById('footer');

        script.type = 'text/javascript';

        script.src = '/js/'+ js;

        footer.appendChild(script);

    });

}



marcel ethan
marcel ethan

Total Post:105

Points:735
Posted on    February-01-2015 10:43 PM

If you're not stepping out of the same domain, you could use getScript()

var scriptUrls = ["http://x/foo", "http://x/bar"];

var loadScr;

loadScr = function(){

    if(scriptUrls.length==0)return;

    var currentUrl = scriptUrls.pop();

    $.getScript(url, loadScr);

}

loadScr();


Don't want to miss updates? Please click the below button!

Follow MindStick