資源描述：
《ext js4序列教程之二 ：異步加載accordion和tree菜單》由會員上傳分享，免費在線閱讀，更多相關(guān)內(nèi)容在應(yīng)用文檔-天天文庫。
1、ExtJS4序列教程之二：異步加載accordion和Tree菜單1、序言EXTJS4序列教程主要講解WEB開發(fā)中一些常用的組件，例如Tree,Grid,Combobox,form等，EXTJS4的出現(xiàn)為廣大程序員帶來了福音，我們可以用較少的代碼，實現(xiàn)很炫麗的效果，我在很多項目的架構(gòu)中都使用EXTJS作為核心的WEB框架，配合jQuery框架，大家很容易實現(xiàn)一個用戶體驗很不錯的軟件系統(tǒng)（我們稱之為高大上，哈哈哈）。EXTJS自推出以來，其性能就飽受開發(fā)的砰擊，在EXTJS4以前的版本，性能確實不是很好，不過比起jQueryEasyUI，那還是要好很多的，從EXTJS4.2以后的版
2、本開始，性能還是很不錯的，代碼也比較精簡，結(jié)構(gòu)清晰，純面像對象的語法，BUG也較EXTJS4.1少了很多，相對比較穩(wěn)定，EXTJS4推出了MVC模式的設(shè)計風(fēng)格，使得代碼結(jié)構(gòu)更加清晰，可讀性更好，非常類似于使用JAVASWING和C#WinForm開發(fā)，但如果沒有接觸過AJAX框架的程序員，第一次使用EXTJS4會碰到各種各樣的問題，本教程教從零開始講解EXTJS4,從客戶端到服務(wù)器都有完整的代碼，服務(wù)端使用SSH框架，用注解方式進(jìn)行開發(fā)，拋棄了繁鎖的配置文件（我本人相當(dāng)討厭配置文件，在我設(shè)計的架構(gòu)中，配置文件幾乎為零）。關(guān)于源碼，由于Google無法訪問（IT業(yè)的一大悲?。?，大家
3、可以到CSDN上下載。本文從實際應(yīng)用出發(fā)，講解與WEB系統(tǒng)開發(fā)息息相關(guān)的實例，EXTJS功能很豐富，由有時間的原因，我不會所有的功能都講到（我都是利用業(yè)余時間寫教程，目前在一家公司擔(dān)任高級架構(gòu)師，工作很忙，我寫教程主要是在互聯(lián)網(wǎng)上和大家一起分享自己的開發(fā)經(jīng)驗），大家按照本套系列教程來逐步開發(fā)代碼，可以實現(xiàn)一個功能比較完整的WEB系統(tǒng)。本教程后端使用的架構(gòu)為Struts2+Hibernate4+Spring4，后續(xù)我將會逐一介紹SSH架構(gòu)的搭建。關(guān)于ASP.NET的教程，會在后續(xù)推出。作者：山人2014/11/141、異步accordion和Tree菜單好了，各位觀眾，前面我們講了
4、layout布局中的border布局，本章我要介紹一個另大家興奮的東西，那就是異步accordion和Tree菜單，這類菜單在實際的項目中經(jīng)常會用到，accordion菜單作為功能模塊菜單，Tree菜單作為功能點菜單，由其是規(guī)模較大的項目，應(yīng)用較為普遍。我在網(wǎng)上搜索發(fā)現(xiàn)類似的例子有很多，但是很少有異步加載Tree的例子，很多都是一次性加載，這不僅會消耗多余的資源，造成服務(wù)端和客戶端的查詢、顯示效率下降，而且不利于權(quán)限控制，例如Spring-acegi安全框架。如果是政府類的安全性和保密性要求較高的應(yīng)用系統(tǒng)，是不適用的，前段時間鬧的沸沸揚(yáng)揚(yáng)的香港占中事件，國外黑客宣布要入侵中國的電
5、子政務(wù)系統(tǒng)，以支持香港占中，這對我國的電子政務(wù)系統(tǒng)的安全性提出了挑戰(zhàn)，一個很小的漏網(wǎng)都可能會成為黑客入侵的目標(biāo)，造成較大的損失。所以，菜單的異步加載和權(quán)限控制是很有必要的，因為只有異常加載菜單才能較好的與安全框架集成，如果把權(quán)限控制放在客戶端腳本里，黑客就可以通過修改腳本執(zhí)行順序、跨站腳本攻擊等技術(shù)攻擊我們的系統(tǒng)，得到系統(tǒng)管理員的權(quán)限。說了這么多題外話，我們先來看一下效果：怎么樣，高大上吧？其實高大上就是這么來的。當(dāng)然，很多按鈕位置錯亂、節(jié)點錯亂、半天不響應(yīng)的UI也是這么來的，我們稱之為“土肥圓”，不知道你有沒有見過，反正我是見過，最讓人佩服的是，這樣的系統(tǒng)還被客戶使勁的夸，我們
6、只能徹底拜服在這位項目經(jīng)理的腳下。由此可知，做好一個系統(tǒng)，不是你的功能做的有多強(qiáng)就可以的，關(guān)鍵還是要維護(hù)好客戶關(guān)系的。以上界面具體實現(xiàn)步驟如下：第一步：老姜一塊，我們需要在JSP中引入ExtJS4的類庫，這一步是必須的。<%@pagepageEncoding="UTF-8"%><%Stringpath=request.getContextPath();StringbasePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><%--樣式文件，加載全
7、部樣式--%><%--extjs文件--%>
