本例是采用JSP + Ajax + 文本來(lái)演示多選、全選，添加、刪除、更新checkbox多選框的效果。
本例充分展現了利用JavaScript控制HTML DOM以及利用XML http 傳遞數據，利用JSP操作文本的效果。
1，JavaScript 用來(lái)控制頁(yè)面內容的現實(shí)與增刪效果;
2，JSP作為后臺，對文本進(jìn)行讀取、寫(xiě)入、更新等操作;
3，文本格式是用來(lái)存儲數據的，數據編碼UTF-8;4, 本例子在win32,Red hat Linux 9下 jdk1.5,Tomcat 5.0,Apache 2.5下調試通過(guò)，同時(shí)兼容Firefox 1.0,Opera 8.0,IE6。
本例子的優(yōu)點(diǎn):
1，實(shí)時(shí)創(chuàng )建html對象，所見(jiàn)即所得的頁(yè)面增刪操作。顯示速度加快，增加用戶(hù)體驗。
2，XML http傳遞數據是只是一個(gè)id或一個(gè)表單值,節省帶寬。
3，本例子適合采用XML http方式,所以這個(gè)效果實(shí)用性強，可是JS/JSP代碼都很簡(jiǎn)單。
4，有很多東西可以在其他項目中共用,并且解決了操作文本關(guān)于中文字符編碼的問(wèn)題。 (本例子在中文操作系統運行，所以選擇了GBK編碼，如果OS是英文的則需要另外處理，比如改編碼為UTF-8，或者根據需要另外轉換編碼。)
5，有拖拽以及展開(kāi)關(guān)閉的效果，用cookie記錄了位置以及打開(kāi)關(guān)閉狀態(tài)，可以在某個(gè)項目里用。
6，有豐富的注釋,適合初學(xué)者一起探討。
缺點(diǎn)：
1，維護調試麻煩,為了這個(gè)效果是否值得這樣做？如果采用普通的方式，嵌入一個(gè)iframe進(jìn)來(lái)，會(huì )不會(huì )也可以。
2，代碼沒(méi)有更多地優(yōu)化、簡(jiǎn)寫(xiě),有些地方冗余。
3，交互設計方面沒(méi)有好好地做，這里主要表示的是技術(shù)實(shí)現和交流。
源文件下載：checkbox.rar
HTML代碼:
[Ctrl+A 全部選擇 提示：你可先修改部分代碼，再按運行]
由于時(shí)間有限，難免有很多問(wèn)題，希望大家提出來(lái)。其實(shí)本例做的并不怎么好，拿出來(lái)希望眾位多多入指點(diǎn)，同時(shí)也希望對同樣是初學(xué)者的朋友來(lái)說(shuō)有幫助，也希望大家一起交流進(jìn)步，謝謝！:p
另外之前做的有關(guān)Ajax的東東，順便請供參考，謝謝！
聯(lián)系客服
