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>
阅读更多
个人分类: JS
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭
关闭