スクリプトを連続してロードする

Question

私は、読み込まれたスクリプトの前にスクリプトがロードされているため、スクリプトを順番に読み込みます。例えば、js/global.js,js/menu.js,js/loan.jsおよびjs/contribution.jsがこの順に必要であり、contributions.jsがloan.js、loan,js、menu.jsなどである必要があります。私は以下のコードでこれを達成することができました。必要な順序の代わりにcontributions.jsで、私はこのからwindow.location = "http://cooperative-izumedia.rhcloud.com/dashboard.html";に多分window.location = "http://cooperative-izumedia.rhcloud.com/contributions.html";を使用してページを変更し、もはやそれをバックアップ史上負荷が最初にロードされるときに

$(document).ready(function() { 

LoadScriptscontri(); 
}); 

function LoadScriptscontri(async) { 
    if (async === undefined) { 
     async = false; 
    } 
    var scripts = []; 
    var _scripts = [ 'js/global.js', 'js/menu.js', 'js/loan.js', 'js/contributions.js']; 

    if (async) { 
     LoadScriptsAsync(_scripts, scripts) 
    } else { 
     LoadScriptsSync(_scripts, scripts) 
    } 
} 

    // what you are looking for : 
    function LoadScriptsSync(_scripts, scripts) { 

    var x = 0; 
    var loopArray = function (_scripts, scripts) { 
     // call itself 
     loadScript(_scripts[x], scripts[x], function() { 
      // set x to next item 
      x++; 
      // any more items in array? 
      if (x < _scripts.length) { 
       loopArray(_scripts, scripts); 
      } 
     }); 
    } 
    loopArray(_scripts, scripts); 
} 

// async load as in your code 
function LoadScriptsAsync(_scripts, scripts) { 
    for (var i = 0; i < _scripts.length; i++) { 
     loadScript(_scripts[i], scripts[i], function() { }); 
    } 
} 

// load script function with callback to handle synchronicity 
function loadScript(src, script, callback) { 

    script = document.createElement('script'); 
    script.onerror = function() { 
     // handling error when loading script 
     alert('Error to handle') 
    } 
    script.onload = function() { 
     console.log(src + ' loaded ') 
     callback(); 
    } 
    script.src = src; 
    document.getElementsByTagName('head')[0].appendChild(script); 
} 

が、彼の問題があります。正確に何が起こっているのですか、どうすればこの問題を取り除くことができますか？私はfirefoxとchromeの両方でテストしましたが、私はまだ同じ結果を得ています。

私はあなたがRequireJSのようなものを使用してになります情報

dashboardjsloader.js:54 js/global.js loaded

dashboardjsloader.js:54 js/menu.js loaded

dashboardjsloader.js:54 js/loan.js loaded

dashboardjsloader.js:54 js/dashboard.js loaded

menu.js:113 id in menu.js = d2b2aecb0197b6f439056 /*here am spitting out the id got from menu.js*/

dashboard.js:119 0 /*here dashboard.js is able to determine that the section it will work on is of index 0 thanks to menu.js*/

Navigated to http://cooperative-izumedia.rhcloud.com/contributions.html/*here I change page*/

contributionsjsloader.js:54 js/global.js loaded

contributionsjsloader.js:54 js/menu.js loaded

contributionsjsloader.js:54 js/loan.js loaded

contributions.js:71 Contri something /*For some reason menu.js isnt't called to spit out its value before contribution.js tell us something even before contibution.js is loaded which loaded below*/

contributionsjsloader.js:54 js/contributions.js loaded

menu.js:183 can't make index TypeError: Cannot read property 'removeAttribute' of undefined /*Now menu.js decides to show its face and this exception is allowed, its expected.*/

menu.js:113 id in menu.js = d2b2aecb0197b6f439056 /* and then it finally spits out its value*/

Navigated to http://cooperative-izumedia.rhcloud.com/dashboard.html

dashboardjsloader.js:54 js/global.js loaded

dashboardjsloader.js:54 js/menu.js loaded

dashboardjsloader.js:54 js/loan.js loaded

dashboardjsloader.js:54 js/dashboard.js loaded

/* I go back to dashboard and because menu is not called first my dashboard.js goes to complete shits */

dashboard.js:119 NaN

dashboard.js:132 TypeError: Cannot set property 'innerHTML' of undefined

dashboard.js:75 in dashboard TypeError: Cannot set property 'innerHTML' of undefined

/*Now menu.js rears its ugly head*/

menu.js:113 id in menu.js = d2b2aecb0197b6f439056

Answer 1

をデバッグする - それはあなたが常に確定正しい順序ですべてのコードを必要とすることができますので、あなたが明示的に他のモジュールに依存しているモジュールを定義しますことができます。