1

尝试编写更好的 JavaScript，哇哦！

对我来说第一步：YUILoader 依赖加载器，所以我所有的自定义代码都可以在可靠的时间点使用。

我现在的环境：

  • YUI (2.8.1) 库路径：C:\wamp\www\lib\js\yui\2\build\ (http://localhost/lib/js/yui/2/build/)
  • 位于上述位置的所有 YUI min、调试和原始文件
  • 自定义库路径：C:\wamp\www\lib\js\ (http://localhost/lib/js/)
  • 位于上述位置的自定义模块“fln-min.js”
  • 在 Chrome 中测试

笔记：

下面是我的示例 HTML 页面，我的自定义模块遵循 HTML 代码。还没有 CSS 或任何时髦的东西，我只是想让它作为概念证明。如果您运行我的代码，您会看到两个 onSuccess 事件都会触发，但在嵌套回调中数据为空，并且我的自定义模块似乎不可用。我尝试了一些东西，比如路径连接，因此在第一个 YUILoader 实例中是“base”，在第二个 YUILoader 实例中注释掉了第二个“fullpath”。

演示 HTML 页面：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>External file Loader</title>
  <script src="/lib/js/yui/2/build/yuiloader/yuiloader-min.js"></script>
  <script>
   new YAHOO.util.YUILoader({

    base: '/lib/js/yui/2/build/',
    require: ['yahoo-dom-event'],
//    require: ['yahoo-dom-event','reset-fonts-grids','container'],
//    allowRollup: true,
//    combine: true,

    onSuccess: function() {

     alert('YAHOO: '+YAHOO);

     var loader = new YAHOO.util.YUILoader();
     //
     loader.addModule({
      name:'FLN',
//      varName:'FLN',
      type:'js',
      fullpath:'/lib/js/fln-min.js'
//      fullpath:'../../../fln-min.js'
     }); 
     loader.onSuccess = function(o) {
      // 
      alert('o.data: '+YAHOO.lang.dump(o.data));
      alert('FLN: '+FLN);
      //
     };
     loader.onFailure = function(o) {
      // 
      alert('Error: '+YAHOO.lang.dump(o));
      //
     };
     loader.insert();
    }

   }).insert();
  </script>
 </head>
 <body>
  <div id="output"></div>
 </body>
</html>

自定义模块（fln-min.js）：

var FLN = function(){

 var _debug = false ;
 var _masterDebug = false ;

 return {
  loaded: function(){ return true; }
    }

}();
alert('...');
4

1 回答 1

0

正确答案是： #1 的配置对象在其数组new Loader()中缺少自定义模块键名。FLNrequires

于 2010-11-30T12:40:28.323 回答