/**

* js 利用 ajax 加载 js ,显示加载进度 ,严格按照js的顺序先后加载到页面

* 原理：利用 ajax 异步多线程快速加载， 每个文件加载完成后存入到加载完成数组中,

*      显示到页面时完全按传入的顺序加入到页面

* @param {array}    files              要加载的文件列表，显示时也按照此顺序一个一个加入到页面

* @param {fun}      funOk              加载完成后的回调

* @param {fun}      funPercent         加载过程中的回调

*/

function ajaxLoadJs(files,funOk,funPercent) {

   var fileData = [];//记录加载完的文件

   var oknum = 0 ; //加载完成的数量

   //循环异步加载文件

   for (var i = 0; i < files.length; i++) {

      loadfile(files[i]);

   }

   //加载文件

   function loadfile(file) {

      $.ajax({

          url: file,

          dataType: "text",

          success: function (data) {

            oknum++;

              fileData[file] = data; //加载成功写入数组

              loadok(file);//调用成功后的处理

          },

          error: function (XMLHttpRequest, textStatus, errorThrown) {

              console.log("加载失败："+file)

              console.log(textStatus)

              console.log(errorThrown)

          }

      });

   }

   //加载成功后的处理

   function loadok(file) {

      //计算加载进度

      //这里加1，因为输出js文件到页面，也需要时间，加1就是把输出js的时间计为一个文件

      //这样所有文件加载完成后是 99% ，输出到页面完成后，才是 100%

      var percent = oknum  / (files.length + 1) ;

      if(typeof(funPercent)=="function") funPercent(percent, file);

      //加载完成后，按传的顺序输出js到页面

      if (oknum == files.length) {

      for (var i = 0; i < files.length; i++) {

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

        script.innerHTML = fileData[files[i]];

        document.getElementsByTagName('HEAD').item(0).appendChild(script);

      }

      if(typeof(funPercent)=="function") funPercent(1, "all"); //输出完成即认为加载完成

         if(typeof(funOk)=="function") funOk();	//回调完成事件

      }

   }

}

var files = [

  'laz_word/controllers/word_set_ctrl.js?ver=31',

  'laz_word/controllers/word_set_ctrl.js?ver=31',

];

ajaxLoadJs(files,function(){

    console.log("====over======");

},function(percent,file){

  console.log(percent,file);

});