ScriptLoader = function() {
this.timeout = 30;
this.scripts = [];
this.disableCaching = false;
this.loadMask = null;
};
ScriptLoader.prototype = {
showMask: function() {
if (!this.loadMask) {
this.loadMask = new Ext.LoadMask(Ext.getBody());
this.loadMask.show();
}
},
hideMask: function() {
if (this.loadMask) {
this.loadMask.hide();
this.loadMask = null;
}
},
processSuccess: function(response) {
this.scripts[response.argument.url] = true;
window.execScript ? window.execScript(response.responseText) : window.eval(response.responseText);
if (response.argument.options.scripts.length == 0) {
this.hideMask();
}
if (typeof response.argument.callback == 'function') {
response.argument.callback.call(response.argument.scope);
}
},
processFailure: function(response) {
this.hideMask();
Ext.MessageBox.show({title: 'Application Error', msg: 'Script library could not be loaded.', closable: false, icon: Ext.MessageBox.ERROR, minWidth: 200});
setTimeout(function() { Ext.MessageBox.hide(); }, 3000);
},
load: function(url, callback) {
var cfg, callerScope;
if (typeof url == 'object') { // must be config object
cfg = url;
url = cfg.url;
callback = callback || cfg.callback;
callerScope = cfg.scope;
if (typeof cfg.timeout != 'undefined') {
this.timeout = cfg.timeout;
}
if (typeof cfg.disableCaching != 'undefined') {
this.disableCaching = cfg.disableCaching;
}
}
if (this.scripts[url]) {
if (typeof callback == 'function') {
callback.call(callerScope || window);
}
return null;
}
this.showMask();
Ext.Ajax.request({
url: url,
success: this.processSuccess,
failure: this.processFailure,
scope: this,
timeout: (this.timeout*1000),
disableCaching: this.disableCaching,
argument: {
'url': url,
'scope': callerScope || window,
'callback': callback,
'options': cfg
}
});
}
};
ScriptLoaderMgr = function() {
this.loader = new ScriptLoader();
this.load = function(o) {
if (!Ext.isArray(o.scripts)) {
o.scripts = [o.scripts];
}
o.url = o.scripts.shift();
if (o.scripts.length == 0) {
this.loader.load(o);
} else {
o.scope = this;
this.loader.load(o, function() {
this.load(o);
});
}
};
};
ScriptMgr = new ScriptLoaderMgr();
构建一个one page one application的应用,动态的加载js组件是关键,虽然看到了5,6种解决方案,可是还是没办法做的很通用,作为一个项目组件。突然发现ExtJs的官方论坛确实是个好地方,由很多好用的资源,可是E文还是没有母语看这舒服,把最好的方案记录下。原文地址:http://extjs.com/forum/showthread.php?t=37897
使用示例:
ScriptMgr.load({
scripts: ['/js/other-prerequisite.js', '/js/other.js'],
callback: function() {
var other = new OtherObject();
alert(other); //just loaded
}
});
分享到:
相关推荐
Ext2.0是Ext JS库的一个早期版本,它是一个用于构建富互联网应用程序(RIA)的JavaScript框架。这个框架提供了一套完整的UI组件和强大的数据管理功能,使得开发者能够创建交互性强、功能丰富的Web应用。全组件和帮助...
### 使用Ext 2.0完成常见JavaScript任务 #### 一、引言 Ext 2.0是一款非常流行的JavaScript框架,它极大地简化了Web应用程序的开发过程。本文将详细介绍如何使用Ext 2.0来实现一些JavaScript中的常见任务,如DOM...
8. **Tree Panel**:EXT 2.0 还包含了一个树形视图组件,用于展示层次结构的数据,支持动态加载和节点操作。 9. **Drag and Drop**:EXT 2.0 提供了拖放功能,可以实现组件之间的交互,增强用户体验。 10. **图表*...
EXT2.0-API是关于EXT JavaScript库的一个重要版本的接口文档。EXT是一个广泛使用的前端开发框架,特别是用于构建数据驱动的Web应用程序。EXT2.0是EXT库的一个里程碑,引入了许多增强功能和改进,使开发者能够创建...
9. **工具提示和弹出框**:Ext 2.0提供了Tip和MessageBox等组件,方便添加提示信息和弹出对话框,提升用户体验。 10. **国际化支持**:尽管这个中文API文档是针对中文环境的,但Ext 2.0本身具有很好的国际化支持,...
9. **工具提示(Tooltips)**:可以为任何元素添加动态显示的提示信息。 10. **事件处理(Event Handling)**:组件间的交互主要通过事件驱动,如点击、改变等。开发者可以通过监听和触发事件来实现复杂的功能。 ...
EXT 2.0 API 是一个用于构建富互联网应用程序(Rich Internet Applications, RIA)的JavaScript框架,它在前端开发领域中扮演着重要角色。EXT 2.0 提供了一套全面且强大的组件库,使开发者能够创建功能丰富的、交互...
这个实用简明教程可能涵盖了EXT2.0的所有内容,并且可能深入到EXT3.x或更高版本的特性,如EXT JS的Grid Panel(表格面板)的高级功能、数据存储和远程数据加载、图表组件、拖放操作以及自定义组件的开发。...
EXT 是一个流行的 JavaScript 框架,专门用于构建富客户端的 Web 应用程序。EXT 2.0 版本在此基础上提供了更完善的前端交互功能,特别是在前后台数据通信方面。EXT 的核心优势在于它的组件化设计,能够轻松地创建...
【Ext2.0】只有月份的日期控件 在网页应用开发中,用户界面的交互性和易用性是至关重要的。...不过需要注意的是,由于这是针对Ext2.0的扩展,对于更新版本的Ext JS框架,可能需要进行适配或寻找相应的替代组件。
总的来说,Ext JS 2.0是JavaScript库中的一颗璀璨明珠,它的出现极大地推动了Web应用程序的发展,为开发者提供了构建高性能、交互丰富的RIA的强大工具。无论你是初学者还是经验丰富的开发者,深入学习和掌握Ext JS ...
标题中的"ext2.0中文语言包gb2312格式"指的是EXT JS框架的2.0版本的一个中文语言包,该包采用了GB2312编码格式。EXT JS是一个广泛使用的JavaScript库,用于构建富互联网应用程序(RIA)。它提供了一套完整的组件模型...
总之,"Ext2.0 文件上传组件"是一个强大且灵活的前端工具,通过理解其核心特性、工作原理以及如何在项目中集成和优化,开发者可以为用户提供高效、安全的文件上传功能。深入学习源码将有助于定制化需求,提升应用的...
**Ext2.0实用简明教程** 在Web开发领域,ExtJS是一个强大的JavaScript库,用于构建用户界面。本文档将详细介绍ExtJS 2.0版本,帮助开发者快速掌握其核心概念和常用功能。 **一、序** 在互联网应用日益复杂的今天...
Ext.NET 2.0 是对Ext JS库的.NET封装,Ext JS是一个强大的JavaScript库,用于创建具有丰富用户界面的Web应用。通过Ext.NET 2.0,开发者可以直接在C#或VB.NET中编写代码,利用.NET的强类型和面向对象特性,无需深入...
3. **配置应用**:创建EXT应用程序的基本结构,包括App.js文件,定义你的应用程序类,并配置所需的组件和视图。 4. **编写组件**:根据需求创建自定义组件,EXT5.0提供了丰富的预定义组件,你可以直接使用,也可以...
总的来说,EXT2.02文档下载提供了EXT框架的重要开发资源,特别是API文档,对于任何使用EXT2.0进行开发的人员来说都是必不可少的工具。结合这些文档和其他辅助资源,开发者可以更好地掌握EXT2.0的用法,提升开发效率...
6. **工具提示(Tooltips)**:EXT提供了一种自定义的工具提示功能,可以为任何元素添加动态显示的信息。API文档会指导开发者如何创建和配置这些提示。 7. **拖放(Drag and Drop)**:EXT支持拖放操作,使得用户...
8. **API文档**:EXT2.0_API.chm是EXT框架的API参考手册,包含了所有类、方法和属性的详细说明,是开发时的重要参考资料。 9. **版本**:ext-2.2.zip代表EXT框架的2.2版本,这是一个较早的版本,但依然包含了许多...
EXT是一个强大的JavaScript框架,它提供了丰富的组件库,包括下拉树(TreePicker)这样的控件。这篇博客文章可能是介绍如何在EXT中实现一个下拉树的功能,并提供了一个名为`TreePicker.js`的代码示例。 EXT框架由...