Question

我想阻止我的系统不止一次加载相同的脚本，因为可以组合不同的模块，我使用我不想操纵的第三方库。

以前有人这样做过吗？

Answer 1

RequireJS怎么样？似乎是你在寻找的东西。

Answer 2

由于诸如Require JS这样的库无法解决我的问题，我自己制定了解决方案，我将在下面发布。

我的系统也是由不同的模块制作的。在主模块中，我有一个加载器，用于所有模块（php，js和css文件）的依赖项。加载依赖项后，应用程序会触发一个事件并设置一个全局变量，以防止双重包含文件。

希望它有所帮助。如果您有任何疑问，请告诉我。

代码：

//Main 
var main = {
    init: function(){
        //Dependencies to load (php, js or css)
        var deps = [
            '/helpers/edit/v/edit.php',                
            '/helpers/edit/css/edit.css',              
            '/helpers/validate/js/jquery.validate.js,messages_pt_BR.js'
        ];        
        //Load initial pack
        if (!window.editReady){
            //Load dependencies
            this.load('edit',deps);        

            //Bind loaded event
            $('body').on('editReady',function(){
                //Set editLoaded to avoid double ajax requests
                window.editReady = true;

                //Do whatever you need after it's loaded

            });
        }
    },
    //Load external resources
    load: function(name,data_urls){
        var url, ext;  
        var len = data_urls.length;
        var i = 0;
        $(data_urls).each(function(){
          //Get proper file
          $.get(this, function(data) {
              url = this.url;
              ext = url.split('.').pop();
              switch(ext){
                  case 'php':
                      this.appended
                      $(data).appendTo('body');
                      break;
                  case 'css':
                      $('<link/>')
                        .attr({
                          'rel':'stylesheet',
                          'href':url
                        }).appendTo('head');
                      break;
              }
              //Check if all files are included
              i += 1;
              if (i == len) {
                $("body").trigger(name+"Ready");
              }
          });
        });
    }
};

var modules = {
    themes : {
        init : function(){
            //Load dependencies
            var deps = [
                '/helpers/plupload/js/plupload.js,plupload.html5.js,plupload.flash.js' 
            ];        
            if (!window.themesReady){
                //Set themesReady to avoid double ajax requests
                window.themesReady = true;

                //Load dependencies
                main.load('themes',deps);   

                $('body').on('themesReady',function(){

                    //Do whatever you need after it's ready
                });
            }
        }
    }
}    
main.init();

不要多次加载相同的JavaScript

2 个答案: