初学 ExtJS 遇到的一些问题及解决办法

快毕业了，最近参加了一个面试，面试时考官要我用一个半小时完成一个Ajax的包括前台和后台的用户管理系统，由于我以前一直在练习用JavaScript直接去做Ajax的相关操作，没有去看市面上的JS框架，加上数据访问的方法由于最近学习WCF给遗忘了不少，最终结果可想而知。所以回来后我抓紧时间学习现有框架。建议要参加上机面试的同学赶紧熟悉熟悉这些框架吧，不要像我似的把好的机会丢掉了。以下是我这两天学习ExtJS遇到的一些问题和解决办法，希望能帮助和我一样刚开始学习ExtJS的人们。

1. 至少需要将 SDK 中哪些文件包含到项目中？

整个 resources 文件夹
ext-all.js
adapter/ext/ext-base.js （我下载的版本是3.0.3）
2. 如何让ExtJS在浏览器中运行起来？
一个CSS文件，两个 JavaScript 文件和一个属性设置（注意JS文件引入的顺序）

<!-- ExtJSPath 为 ExtJS 文件夹的路径-->
<!-- ext-all.css 控制 Ext 部件的显示，如果部件的显示需要改变可以在此文件后引入一个重载的 CSS 文件 -->
<link rel="stylesheet" type="text/css" href="ExtJSPath/resources/css/ext-all.css" />
<!-- ext-base.js 是 Ext 的“Adapter”，这个文件提供 Ext 的核心功能，我们也可以使用其他的JS库 -->
<script type="text/javascript" language="javascript" src="ExtJSPath/adapter/ext/ext-base.js"></script>
<!-- ext-all-debug.js/ext-all.js 包含所有的控件 -->
<script type="text/javascript" language="javascript" src="ExtJSPath/ext-all-debug.js"></script>
<!-- 设置 Ext.BLANK_IMAGE_URL 属性 -->
<script type="text/javascript" language="javascript">
Ext.BLANK_IMAGE_URL = "ExtJSPath/resources/images/default/s.gif";
</script>

3. 如何使用非 ExtJS 适配器？
这个问题解决办法其实在 SDK 中的 INCLUDE_ORDER.txt 文件已经给出了答案。
以下列出针对各个主流框架引用 JavaScript 文件的顺序：

Yahoo! UI (.12+)
-------------------------------------------------------------------
yui-utilities.js
ext-yui-adapter.js
ext-all.js (or your choice of files)

jQuery (1.1+)
-------------------------------------------------------------------
jquery.js
ext-jquery-adapter.js
ext-all.js (or your choice of files)

Prototype (1.5+) / Scriptaculous (1.7+)
-------------------------------------------------------------------
prototype.js
scriptaculous.js?load=effects (or whatever you want to load)
ext-prototype-adapter.js
ext-all.js (or your choice of files)

4. 断网情况下，显示出现问题！
产生原因：未找到 s.gif 这个图片，这个图片是 ExtJS 框架 UI 部分的重要成分，它用于创建像图标这样的项。默认情况下，Ext.BLANK_IMAGE_URL 属性指向 http://extjs.com/s.gif。
解决办法：配置 Ext.BLANK_IMAGE_URL 属性为“ExtJSPath/resources/images/default/s.gif”。如上面的代码所示。

5. 在 IE 和FF 中字体不一样！
产生原因：ExtJS 中很多情况下使用11px，对于11px，不同的浏览器对其渲染不同。IE 的渲染和12px相似，在 FF 中10px相似。
解决办法：将 resources/css/ext-all.css 中的 font 或 font-size 后的11px全部替换为12px。

6. 无法查看 API ！
产生原因：API 的访问需要用到 Ajax 功能。
解决办法：将 SDK 文件夹部署到服务器上。

转自：http://www.cnblogs.com/lanpei/

生活不易，码农辛苦
如果您觉得本网站对您的学习有所帮助,可以手机扫描二维码进行捐赠