cgi|dhtml|用戶端 用戶端CGI——結合javascript、dhtml實現bbs的backoffice（只與伺服器互動一次）。
最近見到很多朋友問有關對form元素的操作問題，下面把我寫的一個bbs的backoffice部分帖出來給大家。這個程式實現了對bbs中欄目及其下屬論壇的增、刪、改名、排序、移動、修改屬性等等操作，而只與伺服器互動一次，其中用到的表單元素有text , button, submit,select , textarea等，如果你能夠全部理解這些代碼，那麼不敢說你精通javascript和dhtml（我就不敢），最起碼可以說你會了。
因為是草稿，所以未進行程式最佳化及介面處理，實際上你如果結合css可以把它做得象一個windows程式而不象html頁面。另外一條因為我是用ie5來測試的，所以其中一些寫法不是很規範，如引用form名時前面沒加document ， 函數沒有傳回值等，這些在nescape裡都是不允許的，如果你要在nescape裡用，請自己把文法規範了。
由於原始碼很長（30000多位元組），我將分為幾個部分來講，你把幾部分中的代碼合在一起存為一個html檔案就可以直接運行了。首先需要從資料庫中取出記錄放到前台javascript數組中，因為著重點是放在前台，所以這裡的asp我就不列出來了，只把它產生的html列出來，它的目的是產生數組及初始頁面。這部分代碼中牽涉到一個產生javascript二維數組的技巧，請大家仔細看一下，這是整個程式的關鍵所在。下面這段程式產生兩個數組，一個是aCategory，代表bbs大的欄目，共有四個；另一個是aForum，代表同欄目相關聯的論壇。整個程式的操作實際上就是圍繞著兩個數組來實現的，同這兩個數組相關聯的是表單frmManager的兩個select ：selCategory和selForum。
<script language=javascript>
//版塊數組的建構函式
function MakeCategory(CategoryID , CategoryName , OrderNum)
{
this.CategoryID = CategoryID ;
this.CategoryName = CategoryName ;
this.OrderNum = OrderNum ;
return this ;
}
//論壇數組的建構函式
function MakeForum(CategoryID , CategoryName , OrderNum , RootCategoryID , Description , MasterID)
{
this.CategoryID = CategoryID ;
this.CategoryName = CategoryName ;
this.OrderNum = OrderNum ;
this.RootCategoryID = RootCategoryID ;
this.Description = Description ;
this.MasterID = MasterID ;
return this ;
}
//建立版塊數組並賦值
var aCategory = new Array() ;
aCategory[0] = new MakeCategory(1 , '技術交流' ,1) ;
aCategory[1] = new MakeCategory(2 , '專案管理' ,2) ;
aCategory[2] = new MakeCategory(3 , '內部公告' ,3) ;
aCategory[3] = new MakeCategory(4 , '海闊天空' ,4) ;
//建立論壇數組並賦值
var aForum = new Array() ;
aForum[0] = new MakeForum(5 , 'Asp&Database' ,1 ,1 ,'asp, access,PB, sql.oralce,etc. ',1);
aForum[1] = new MakeForum(6 , 'Design World' ,2 ,1 ,'photoshop,dreamweaver,flash, 3dmax,etc.',2);
aForum[2] = new MakeForum(7 , 'Design World' ,3 ,1 ,'photoshop,dreamweaver,flash, 3dmax,etc.',2);
aForum[3] = new MakeForum(8 , 'Program Language' ,4 ,1 ,'Java, html/dhtml/xml, C/C++, Php/Jsp, vbscript/javascript, etc.',1);
aForum[4] = new MakeForum(9 , 'System Administration' ,5 ,1 ,'Windows9x/NT/2000, Unix, Linux , etc.',2);
aForum[5] = new MakeForum(10 , 'Network Security' ,6 ,1 ,'TCP/IP, Socket, hacker, FireWall, Proxy, etc.',1);
aForum[6] = new MakeForum(11 , 'New Idea' ,7 ,1 ,'Welcome all Creative, innovative and anything different .',1);
aForum[7] = new MakeForum(12 , '4biz電子商務搜尋引擎門戶項目' ,1 ,2 ,'E-Commerce Search Engine Portal.',2);
aForum[8] = new MakeForum(13 , 'Poker Town ' ,2 ,2 ,'Our first Online Game.',1);
aForum[9] = new MakeForum(14 , 'Vertigine' ,3 ,2 ,'Powerful Vertical Search Engine.',2);
aForum[10] = new MakeForum(15 , 'EasyCase' ,4 ,2 ,'EasyCase-New modeling tool.',1);
aForum[11] = new MakeForum(16 , '日常管理' ,1 ,3 ,'Daily Grind.',2);
aForum[12] = new MakeForum(17 , '臨時通知' ,2 ,3 ,'Temporary Notice.',1);
aForum[13] = new MakeForum(18 , '會議安排' ,3 ,3 ,'Meeting Schedule.',2);
aForum[14] = new MakeForum(19 , '有感而發' ,4 ,4 ,'Just say it.',1);
aForum[15] = new MakeForum(20 , '似水流年' ,5 ,4 ,'all that gone with wind.',1);
aForum[16] = new MakeForum(21 , '談情說愛' ,6 ,4 ,'Let"s talk about love.',2);
aForum[17] = new MakeForum(22 , '笑話站' ,7 ,4 ,'Just joke , whatever it is.',1);
</script>
<html>
<
