ext2.1入门必备

ext2.1
本文来自http://www.dojochina.com/?q=node/547
1.下载地址：http://www.extjs.com/download，下载项目：
a.ExtJS 2.1 SDK
b.ExtJS2.1 API Documentation
2.ext2.1的文档说明：需要把docs目录下的文件放置的服务器上，ext中ajax调用需要在服务器运行。
3.图片的显示问题
ext里经常用一个空白图片做占位符号，然后用css里配置的背景图片做显示，这样有利于更换主题。这个空白图片的名字就是Ext.BLANK_IMAGE_URL，默认情况下它的值是BLANK_IMAGE_URL : "http:/"+"/extjs.com/s.gif"。
虽然图片很小，也要去网上下载，一旦下载失败就显示找不到图片了。看到这里可能有人奇怪了，为什么examples下的例子没有找不到图片的问题呢
？看来你没有仔细看例子那些代码呢，每个例子都引用了../examples.js。在examples.js里设置了Ext.BLANK_IMAGE_URL ='../../resources/images/default/s.gif';。
所以要解决自己写的例子找不到图片的问题，只需要照examples.js里修改s.gif的本地路径就可以了。
4.开发工具：firefox+firebug
5.helloword的简单实例
进入上图中的examples目录，新建一个helloworld目录，helloworld目录下新建一个helloworld.html文件，将下列内容复制进helloword.html文件中。

<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../../ext-all.js"></script>
<script type="text/javascript" src="../examples.js"></script>

<script>
Ext.onReady(function(){
    Ext.MessageBox.alert('helloworld', 'Hello World.');
});
</script>双击helloworld.html打开页面
6.仔细查看examples文件夹中的实例
7.项目中必须包含的文件
想把ext放入自己的项目，需要自己整理一下，因为发布包里的东西并非都是必要的，比如文档，比如例子，比如源代码。
必要的最小集合是这样：ext-all.js，adapter/ext/ext-base.js，build/locale/ext-lang-zh_CN.js和整个resources目录。
ext-all.js，adapter/ext/ext-base.js就包含了ext的所有功能，所有的js脚本都在这里了。
build/locale/ext-lang-zh_CN.js是中文翻译。
resources目录下是css样式表和图片。
自己的项目里只需要包含这些东西，就可以使用ext了。使用时，在页面中导入：
<link rel="stylesheet" type="text/css" href="${放置ext的目录}/resources/css/ext-all.css" />
<script type="text/javascript" src="${放置ext的目录}/ext-base.js"></script>
<script type="text/javascript" src="${放置ext的目录}/ext-all.js"></script>
<script type="text/javascript" src="${放置ext的目录}/ext-lang-zh_CN.js"></script>

评论

1 楼 Simon_Chen 2008-06-11  

     8      )