首先，這裡將原本的sec Array改成 section Object
然後將sec Array的資料與birth的資料全部放入section 裡面，並透過areaData()和placeData()來建立結構
原本取用sec的名稱時只要直接帶入place的id到sec的index即可取得，換成section時則透過內建的getPlace()功能來取得名稱(也有getArea()來取得國家名稱)
或許有人會覺得為何要弄得這麼麻煩，但是我認為弄成這樣是有必要的
因為程式設計者看得懂的東西其他人不一定看得懂，所以這時就要用直覺化的物物件給他們操作了
就像上面提到的以前取得sec名稱的寫法，我想有部分架設wog的使用者可能還不明白為何要這樣寫
說了這麼多，還是來看看程式碼吧，下面這串程式碼加在wog.js
尋找
- 代碼: 選擇全部
/*=====================================================
Copyright (C) ETERNAL<iqstar.tw@gmail.com>
Modify : 2005/09/17
URL : http://www.2233.idv.tw
This program is free software; you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation; either version 2 of the License, or
(at your option) any later version.
===================================================== */
下方加上
- 代碼: 選擇全部
var section={
area: new Array(),
placeNum:0,
addArea:function(area_id,name,place){
this.area[area_id]=new areaData(name,place);
},
addPlace:function(area_id,name,place_id){
this.area[area_id].place.push(new placeData(name,area_id,place_id));
this.placeNum++;
},
getArea:function(area_id){
return this.area[area_id].name || null;
},
getPlace:function(place_id){
for(var i in this.area){
for(var j in this.area[i].place){
if(this.area[i].place[j].place_id==place_id){
return this.area[i].place[j].name;
}
}
}
return null;
}
}
function areaData(name,place){
this.name=name,this.place=place || new Array();
}
function placeData(name,area_id,place_id){
this.name=name,this.area_id=area_id,this.place_id=place_id;
}
section.addArea(0,"選擇場所");
section.addArea(1,"中央大陸");
section.addArea(2,"魔法王國");
section.addArea(3,"熱帶雨林");
section.addArea(4,"末日王城");
section.addPlace(0,"選擇場地","");
section.addPlace(1,"中央平原",1);
section.addPlace(1,"黑暗沼澤",3);
section.addPlace(1,"王者之路",7);
section.addPlace(1,"水晶之間",13);
section.addPlace(2,"試鍊洞窟",2);
section.addPlace(2,"幻獸森林",8);
section.addPlace(2,"天空之城",12);
section.addPlace(2,"最果之島",15);
section.addPlace(3,"迷霧森林",4);
section.addPlace(3,"星河異界",9);
section.addPlace(3,"無淵洞窟",11);
section.addPlace(4,"古代遺跡",5);
section.addPlace(4,"久遠戰場",6);
section.addPlace(4,"灼熱荒漠",10);
section.addPlace(4,"失落古船",14);
雖然需要寫較多的程式碼，但是更容易維護的這項優點我想應該能夠蓋過這項缺點^^
接著是直接利用section的兩個函式:select_area()和onlinelist()的程式碼，首先先看select_area()
- 代碼: 選擇全部
function select_area(num,s)
{
var ctr=0;
if(num==='')
num=0;
s.act1.selectedIndex=0;
var area=section.area[num];
for(var i=0;i<area.place.length;i++){
s.act1.options[i]=new Option(area.place[i].name,area.place[i].place_id);
}
s.act1.length=i;
s.act1.options[0].selected=true;
}
看到這裡應該可以看得出來，結構化後的寫法原先的方法簡單多了，而且也比較容易維護^^
接著是onlinelist()
- 代碼: 選擇全部
function onlinelist(peo)
{
var f=parent.wog_peo.document;
message_cls(f,0);
f.write(online_temp_table1);
var secArr=new Array();
var secNum=section.placeNum;
var boy=0;
var girl=0;
if(peo!="")
{
f.write('<tr bgcolor="#2B4686"><td>名稱</td><td>LV</td><td>PK</td></tr>');
var s1=peo.split(";");
for(var i=0;i<s1.length;i++)
{
var s2=s1[i].split(",");
var fcolor=psex(s2[1]);
(s2[1]=="1")?boy++:girl++;
s2[3]=(s2[3]==1)?"Y":"N";
if(!secArr[s2[5]])
secArr[s2[5]]='';
secArr[s2[5]]+='<tr><td><a href=javascript:parent.yesname("'+s2[0]+'") target="foot" title="'+s2[4]+'"><b><font color="'+fcolor+'">'+s2[0]+'</font></b></a></td><td >'+s2[2]+'</td><td>'+s2[3]+'</td></tr>';
}
for(var i=0;i<secNum;i++)
{
if(secArr[i])
{
f.write(secArr[i]);
}
f.write('<tr><td bgcolor="#2B4686" colspan="3">↑'+section.getPlace(i)+'練功↑</td></tr>');
}
f.write('<tr><td bgcolor="#2B4686" colspan="3"><font color="#66ccff">男生</font> '+boy+' 人</td></tr>');
f.write('<tr><td bgcolor="#2B4686" colspan="3"><font color="#ff99cc">女生</font> '+girl+' 人</td></tr>');
f.write('<tr><td bgcolor="#2B4686" colspan="3">線上人數 '+s1.length+' 人</td></tr>');
}else
{
f.write('<tr><td colspan="3" bgcolor="#2B4686">線上人數 0 人</td></tr>');
}
f.write(temp_table2);
}
寫法跟以前有點差距，且運作次數也和以前的不同，不知道這裡有沒有朋友能夠看出點端倪呢? 現在就先賣個關子吧XD
除了這裡之外還有些部分也會用到section的內容，像是status_view()和status_view2()等等，這些部分因為比較瑣碎也有很大的不定性，所以麻煩用搜尋功能尋找後自行改成section的用法吧^^"
以上，若有問題歡迎指教。
