給AJAX新手： 在閱讀這篇前，建議先到以下網址閱讀並實作Sun所提供的新手範例。 http://java.sun.com/developer/technicalArticles/J2EE/AJAX/ 給AJAX老手： 這篇主要目的是在拋磚引玉，吸引高手前來發表心得。Q.Q (為什麼中文資料都是簡體字) 給版主： 我知道這東西比較偏java script，在此希望版主能網開一面，不要浸我水桶啊! 前情提要：一個努力的程式工，在被老闆說頁面呈現太不人性化之後，決定暫時擱下 SCWCD的考試，埋首研究 AJAX。眼看著voucher即將在8/16過期，程式工可以 在最後兩週前完成修改，專心準備考試嗎？ Q.Q" 花了兩天，好不容易摸清了javascript動態頁面對排版所造成的影響之後。順手也把註冊 頁面用上了最近頗流行的密碼強度偵測，雖然跟 AJAX無關，但也算是為自己上了一門 javascript課程。 緊接著，今天繼續嘗試著把原本兩個獨立的頁面利用 AJAX做整合。架構簡單來說，就是 原本兩個兩個獨立的資料庫表單，以及一個跟兩個表單互有關聯的表單的處理。第三個表 單原本是利用獨立的頁面做新增刪除的動作，但是為了避免讓使用者因換頁而造成錯亂的 情形，而要將之合併於處理第二個表單的頁面之中。 所呈現的方式說來很單純，就是一般我們常在side bar選單所看到的隱藏選項。只是這些 選項不是預先寫好在網頁中，而是即時的將資料庫第三個表單的內容呈現出來。這裡我自 認比較關鍵的部份分為Server Side的 XML回應以及 Script Side的處理方法，舉例如下 ： Server Side XML Response: DB DATA - name　age　 hight 父親　60　　165 母親　58　　158 妹妹　18　　160 轉換成 XML格式 - <root> 　<people name="父親" age="60" hight="165"/> 　<people name="母親" age="58" hight="158"/> 　<people name="妹妹" age="18" hight="160"/> <root> 從資料庫所得到的資料，可以用這種簡單的 XML格式回應給瀏覽器做處理。 Script Side 處理方法： 以下範例專注於說明處理回傳的 XML。 首先， 要先取得名為people的元素物件。 var people = req.responseXML.getElementsByTagName("people"); 接下來，依物件長度來依序取得每個元素內的屬性值。 for(var i = 0; i < message.length; i++){ 　var node = people.item(i); 　var name = node.getAttribute('name'); 　var age = node.getAttribute('age'); 　var hight = node.getAttribute('hight'); } 然後，再依自己的需要將這些值作適當的利用即可。其實，也蠻簡單的，不是嗎？ 在最後，要提醒一件事，也許眼尖的人會注意到，那就是「中文」。請切記，要在網路上 傳遞中文資料，千萬別忘了編碼所帶來的影響。像是我的頁面使用UTF-8，但是java script可不會這麼好心幫我們判斷，所以我們一定要記得加上去，請在處理AJAX需求的 Servlet上加上以下這行： response.setCharacterEncoding("utf-8"); 就是這麼簡單，只要告知XMLHttp採何種編碼即可，AJAX中文內容問題就這樣解決了， PS. 雖然... 只與Java扯上一點點的邊，不過還是希望有可能在這個版討論這玩意。 -- No Dying Skills, ● - Dame! New tech... but Lazy Users. .\) http://hougzou.spaces.msn.com/ _____________ ﹒ ︵ √\ ___________________ --

※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 59.104.2.239 ※ 編輯: hougzou 來自: 59.104.2.239 (07/28 00:06)