完成了AJAX樹(shù)附原理分析
2024-09-01 08:29:28
供稿：網(wǎng)友
首先要糾正一個(gè)上篇博文《Rails中的Ajax初體驗(yàn)》中的一個(gè)錯(cuò)誤：上篇博文中，我說(shuō)“要在Rails中使用Ajax，局部模板是必須的”，經(jīng)實(shí)踐檢驗(yàn)，是錯(cuò)誤的，特此更正。實(shí)踐是檢驗(yàn)真理的唯一標(biāo)準(zhǔn)，此言不虛。經(jīng)過(guò)項(xiàng)目中真正通過(guò)RJS實(shí)現(xiàn)AJAX樹(shù)，可知，通過(guò)使用insert_html、replace_html等輔助方法，可直接操作頁(yè)面上的元素，無(wú)須使用局部模板。
整個(gè)的實(shí)現(xiàn)過(guò)程還是有點(diǎn)曲折：
之前使用的生成樹(shù)結(jié)構(gòu)的頁(yè)面，是利用從服務(wù)器獲取的所有數(shù)據(jù)，通過(guò)一系列javascript腳本函數(shù)，一次性地生成整個(gè)樹(shù)結(jié)構(gòu)目錄。這種方式對(duì)付系統(tǒng)的功能菜單還游刃有余，但是要生成包含上千條數(shù)據(jù)的樹(shù)結(jié)構(gòu)時(shí)，客戶端的瀏覽器需要十幾秒鐘才能把整個(gè)樹(shù)結(jié)構(gòu)建立起來(lái)、顯示在頁(yè)面上，這對(duì)于用戶來(lái)說(shuō)是不可忍受的——其實(shí)對(duì)于我們開(kāi)發(fā)者來(lái)說(shuō)，也是不可忍受的。那么一個(gè)可行的辦法就是，利用AJAX技術(shù)，先顯示樹(shù)結(jié)構(gòu)的第一級(jí)節(jié)點(diǎn)，當(dāng)點(diǎn)擊某個(gè)節(jié)點(diǎn)時(shí)，再?gòu)姆?wù)器獲取該節(jié)點(diǎn)的子節(jié)點(diǎn)，顯示出來(lái)。這樣，每次與服務(wù)器交互的數(shù)據(jù)量不大，加快了頁(yè)面響應(yīng)。
一開(kāi)始我打算利用RAILS中的AJAX機(jī)制，配合使用之前那個(gè)版本中的javascript函數(shù)。但是那個(gè)版本的思路，是基于從服務(wù)器獲取的樹(shù)結(jié)構(gòu)數(shù)據(jù)，通過(guò)循環(huán)、遞歸，在服務(wù)器端生成好要在客戶端頁(yè)面執(zhí)行的一系列javascript函數(shù)調(diào)用，以生成樹(shù)結(jié)構(gòu)。至此，還算是比較符合AJAX的思路，但是下一步就大相徑庭了：舊版本的是將生成的那一大串javascript函數(shù)調(diào)用的字符串，一次性地完全返回給客戶端頁(yè)面，客戶端頁(yè)面在加載前，已經(jīng)獲得了這一大串字符串，只需簡(jiǎn)單地把它加載，就一次性的執(zhí)行它、生成樹(shù)結(jié)構(gòu)了。這種方式，等于沒(méi)有給AJAX留下插足的任何機(jī)會(huì)。
此路不通，于是我轉(zhuǎn)而尋找網(wǎng)上別人做的AJAX樹(shù)，試圖將其移植過(guò)來(lái)，為我所用。之前就找到過(guò)一個(gè).NET版的，用C#寫(xiě)的，還沒(méi)仔細(xì)看過(guò)。于是打開(kāi)VS2005，建好了ASPX工程，研究了一下這個(gè).NET版的AJAX樹(shù)。這個(gè)版本自帶了一個(gè)ACCESS數(shù)據(jù)庫(kù)，里面有一些演示數(shù)據(jù)。把IIS架起來(lái)后，運(yùn)行得還真挺順暢。這個(gè)AJAX樹(shù)的功能做得還挺強(qiáng)，可以實(shí)現(xiàn)在頁(yè)面上對(duì)樹(shù)節(jié)點(diǎn)的添加、刪除、編輯、拖拽移動(dòng)操作。代碼也比較清晰：一個(gè)htm頁(yè)面和一個(gè)aspx頁(yè)面，其中aspx頁(yè)面中定義了一些服務(wù)器端函數(shù)，組織出相應(yīng)的要返回給htm頁(yè)面的html代碼段。然而，要把這個(gè)移植過(guò)來(lái)也不容易，首先是對(duì)其生成html代碼段的思路不熟悉，不好控制，另外一點(diǎn)，它是通過(guò)response.write返回所生成的html代碼段，與RJS中直接指定頁(yè)面元素進(jìn)行控制的思路又不一樣。
也是由于通過(guò)對(duì)以上兩種方式的探索，使得我對(duì)做AJAX樹(shù)的思路更加清晰的原因吧，我最終決定還是自己動(dòng)手，完全自己做一個(gè)RAILS下的出來(lái)吧。盡管最終從核心內(nèi)容到細(xì)節(jié)控制，總算是把這棵樹(shù)給搗騰出來(lái)了，但中間遇到幾個(gè)問(wèn)題，有的不知道是否RAILS本身就不支持，還有的明明書(shū)上、別人都行得通，但我這就是不行。不知個(gè)中緣由，列在這里，若有人能夠解答，還望不吝賜教！謝過(guò)先！
