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