完成了AJAX樹附原理分析

2024-09-01 08:29:28

字體：大中小

來源：轉載

供稿：網友

首先要糾正一個上篇博文《Rails中的Ajax初體驗》中的一個錯誤：上篇博文中，我說“要在Rails中使用Ajax，局部模板是必須的”，經實踐檢驗，是錯誤的，特此更正。實踐是檢驗真理的唯一標準，此言不虛。經過項目中真正通過RJS實現AJAX樹，可知，通過使用insert_html、replace_html等輔助方法，可直接操作頁面上的元素，無須使用局部模板。
整個的實現過程還是有點曲折：

之前使用的生成樹結構的頁面，是利用從服務器獲取的所有數據，通過一系列javascript腳本函數，一次性地生成整個樹結構目錄。這種方式對付系統的功能菜單還游刃有余，但是要生成包含上千條數據的樹結構時，客戶端的瀏覽器需要十幾秒鐘才能把整個樹結構建立起來、顯示在頁面上，這對于用戶來說是不可忍受的——其實對于我們開發者來說，也是不可忍受的。那么一個可行的辦法就是，利用AJAX技術，先顯示樹結構的第一級節點，當點擊某個節點時，再從服務器獲取該節點的子節點，顯示出來。這樣，每次與服務器交互的數據量不大，加快了頁面響應。

一開始我打算利用RAILS中的AJAX機制，配合使用之前那個版本中的javascript函數。但是那個版本的思路，是基于從服務器獲取的樹結構數據，通過循環、遞歸，在服務器端生成好要在客戶端頁面執行的一系列javascript函數調用，以生成樹結構。至此，還算是比較符合AJAX的思路，但是下一步就大相徑庭了：舊版本的是將生成的那一大串javascript函數調用的字符串，一次性地完全返回給客戶端頁面，客戶端頁面在加載前，已經獲得了這一大串字符串，只需簡單地把它加載，就一次性的執行它、生成樹結構了。這種方式，等于沒有給AJAX留下插足的任何機會。

此路不通，于是我轉而尋找網上別人做的AJAX樹，試圖將其移植過來，為我所用。之前就找到過一個.NET版的，用C#寫的，還沒仔細看過。于是打開VS2005，建好了ASPX工程，研究了一下這個.NET版的AJAX樹。這個版本自帶了一個ACCESS數據庫，里面有一些演示數據。把IIS架起來后，運行得還真挺順暢。這個AJAX樹的功能做得還挺強，可以實現在頁面上對樹節點的添加、刪除、編輯、拖拽移動操作。代碼也比較清晰：一個htm頁面和一個aspx頁面，其中aspx頁面中定義了一些服務器端函數，組織出相應的要返回給htm頁面的html代碼段。然而，要把這個移植過來也不容易，首先是對其生成html代碼段的思路不熟悉，不好控制，另外一點，它是通過response.write返回所生成的html代碼段，與RJS中直接指定頁面元素進行控制的思路又不一樣。

也是由于通過對以上兩種方式的探索，使得我對做AJAX樹的思路更加清晰的原因吧，我最終決定還是自己動手，完全自己做一個RAILS下的出來吧。盡管最終從核心內容到細節控制，總算是把這棵樹給搗騰出來了，但中間遇到幾個問題，有的不知道是否RAILS本身就不支持，還有的明明書上、別人都行得通，但我這就是不行。不知個中緣由，列在這里，若有人能夠解答，還望不吝賜教！謝過先！

上一篇：ajax 亂碼的一種解決方法

下一篇：Ajax 程序開發中常見問題