初學 ExtJS 遇到的一些問題及解決辦法

快畢業(yè)了，最近參加了一個面試，面試時考官要我用一個半小時完成一個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 部分的重要成分，它用于創(chuàng)建像圖標這樣的項。默認情況下，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/

生活不易，碼農辛苦
如果您覺得本網站對您的學習有所幫助,可以手機掃描二維碼進行捐贈