動態(tài)表格制作說明書

精品文檔精心整理精品文檔可編輯的精品文檔動態(tài)表格制作說明書目錄：1、動態(tài)表格制作說明書2、表格制作說明動態(tài)表格使用說明書動態(tài)表格基本介紹：在動態(tài)表格中，基本是通過XMLTitle、XMLContents、TOT_ID、SHOWJS四個欄位來實現(xiàn)的。其中1.XMLTitle欄位：XMLTitle欄位中放的是動態(tài)表格的表標(biāo)題、表格欄位的樣式、欄位的寬度、欄位內(nèi)容的檢測以及一些動作按鈕。例如：“員工轉(zhuǎn)正自我考核表”中，XMLTitle欄位的內(nèi)容為："工作內(nèi)容（按重要性順序排列）,績效,績效評為中差的原因分析,^TEXT,RADIO,TEXT,^250,200,200,^y,y,n^,優(yōu)|良|中|差|,,^不能為空請檢查|必須是日期型數(shù)據(jù)|必須是數(shù)字型數(shù)據(jù)|輸入了非法字符|^新增&y|刪除&y|修改&y|插入&y|確定&y|取消&y|選擇"以“^”為界限，XMLTitle欄位的內(nèi)容可以分為如下幾個參數(shù)：第一參數(shù)：表格標(biāo)題，如：“工作內(nèi)容（按重要性順序排列）,績效,績效評為中差的原因分析”。第二參數(shù)：欄位類型，類型的詳細(xì)說明見后面。如：“TEXT,RADIO,TEXT”第三參數(shù)：表格欄位寬度。如：“250,200,200,”第四個參數(shù)：是否為空檢測。當(dāng)為“y”時檢測，“n”時不檢測。如：“y,y,n”第五個參數(shù)：輔助參數(shù)，根據(jù)第二個參數(shù)不同有不同的用法，詳見類型使用說明第六個參數(shù)：提示說明（可以不考慮）。如：“不能為空請檢查|必須是日期型數(shù)據(jù)|必須是數(shù)字型數(shù)據(jù)|輸入了非法字符”是對內(nèi)容進(jìn)行檢測后的提示說明。第七個參數(shù)：按鈕上的文字定義（可以不考慮）。如：“新增&y|刪除&y|修改&y|插入&y|確定&y|取消&y|選擇”是一些相關(guān)按鈕上的文字定義。2.XMLContents欄位:XMLContents欄位是對動態(tài)表格的內(nèi)容進(jìn)行傳值的！當(dāng)表單提交后，自動將動態(tài)表格的內(nèi)容付給XMLContents，例如將下面動態(tài)表格的值傳給XMLContents欄位，圖（4）XMLContents欄位的內(nèi)容為：“旺旺三期表單的測試~中~不合格~^動態(tài)表格的制作~優(yōu)~~^”，其中列與列之間的用“~”間隔；行與行之間用“^”間隔；流程走到第二站，在只讀狀況下動態(tài)表格顯示為：圖（5）3.TOT_ID欄位:TOT_ID欄位是調(diào)用XMLTitle欄位的內(nèi)容！其公式為："[<DIVID='HTMLTitle'></DIV>]"4.SHOWJS欄位:SHOWJS欄位控制動態(tài)表格的樣式以及顯示；在第一站，當(dāng)要對動態(tài)表格進(jìn)行編輯時，內(nèi)容為："[<script>"+"varTitleValue=document.all('XMLTitle').value;"+"varXC='XMLContents';"+"varHid='HTMLTitle';"+"varRadioname='F';"+"varsort=true;"+"vartable_width=750;"+"varNoChinese='No';"+"SetHTMLTitle('NULL',Hid,TitleValue,XC,Radioname,sort,table_width,NoChinese);"+"</script>]"當(dāng)SetHTMLTitle函數(shù)的第一個參數(shù)為'NULL'時，動態(tài)表格為編輯狀態(tài)，當(dāng)?shù)谝粋€參數(shù)為‘READ’時為編輯狀態(tài)；’Hid,TitleValue’是調(diào)用'HTMLTitle'欄位當(dāng)中的值；‘XC’是調(diào)用'XMLContents'欄位的值；table_width是動態(tài)表格的寬度；NoChinese是判斷是否顯示序號。而SetHTMLTitle函數(shù)的函數(shù)體在“共用資源”—>檔案—>AutoTable.js中。動態(tài)表格欄位類型的詳細(xì)說明1.動態(tài)表格欄位的格式有：（第二參數(shù)）（1）.TEXT……..…文本格式（2）.RADIO……….單選按鈕（3）.COMBOBOX………………..下拉列表框（4）.POPWINDOW……………….彈出Windows窗口（5）.DATE………...日期格式（6）.N………………數(shù)字格式（7）.R..…………….文本格式，但不可以編輯（不帶值）（8）.P1…………….文本格式，但不可以編輯（帶值）（9）.HJ…………….隱藏欄位2.RADIO…單選按鈕的配置以“員工轉(zhuǎn)正自我考核表”為例，XMLTitle欄位的第二參數(shù)為：“TEXT,RADIO,TEXT,”而與其相對應(yīng)的第五參數(shù)“,優(yōu)|良|中|差|,,”中的紅色部分是單選按鈕的內(nèi)容。單選按鈕內(nèi)容之間以“|”間隔。顯示樣式如圖（2）所示：圖（2）COMBOBOX…下拉列表框的配置以“崗位/薪資異動申請單”為例，XMLTitle欄位的第二參數(shù)為：“COMBOBOX,POPWINDOW,”而與其相對應(yīng)的第五參數(shù)“簽呈|試用期滿通知單|員工轉(zhuǎn)正自我考核表|試用/合同期滿考核表|員工崗位異動考核表|其它|,,”中的紅色部分是下拉列表框的內(nèi)容。下拉列表框內(nèi)容之間以“|”間隔。顯示樣式如圖（3）所示：圖（3）4.POPWINDOW…彈出窗口的配置以“崗位/薪資異動申請單”為例，XMLTitle欄位的第二參數(shù)為：“,POPWINDOW,”而與其相對應(yīng)的第五參數(shù)為空。只需在JS表頭里添加一段OpenPopWindow函數(shù)，其內(nèi)容為：functionOpenPopWindow(item,Dis_XMLContents_name,ind){DialogBoxName="SelectForms"ExchangeFields=""screenh='550'screenw='525'field_jSRadioname=itemDialogBox(DialogBoxName,ExchangeFields,screenh,screenw,false);}其中SelectForms為彈出表單的名稱，ExchangeFields為返回的值，screenh、screenw為彈出表單的長度跟寬度。顯示樣式如圖（3）所示.5.DATE…日期型的配置以“攜眷/攜眷變更/取消攜眷申請表”為例，其第四標(biāo)題的內(nèi)容為日期格式，則XMLTitle欄位的第二參數(shù)為：“,,,DATEBR,”,而與其相對應(yīng)的第五參數(shù)為空:“，，，，”。只需在子表單中添加一個DATEBR欄位，另外在DATEBR欄位的onFocus屬性里添加一下一段JavaScript代碼：“document.all("edtJavaScript_F")[3].value=this.value;”。其顯示樣式如圖（4）所示：圖（4）點擊按鈕彈出如下窗口：6.DATE…多日期型的配置若動態(tài)表格的第三、第四列都是日期型的，則XMLTitle欄位的第二參數(shù)為：“,,DATEBR,DATEBR1,”,而與其相對應(yīng)的第五參數(shù)為空:“，，，，”。只需在子表單中添加DATEBR和DATEBR1兩個欄位。而DATEBR欄位的onFocus屬性內(nèi)容為“document.all("edtJavaScript_F")[2].value=this.value;”。DATEBR1欄位的onFocus屬性內(nèi)容為“document.all("edtJavaScript_F")[3].value=this.value;”。7.欄位的檢測防空的檢測：若XMLTitle欄位第二參數(shù)內(nèi)的值為TEXT格式，且相對應(yīng)的第四參數(shù)為“y”的情況下，如果欄位值為空，則在表單提交時會自動提示“不能為空請檢查”（第六參數(shù)的第一個值）。其它錯誤的檢測若XMLTitle欄位第二參數(shù)內(nèi)的值為DATE格式，且相對應(yīng)的第四參數(shù)為“y”的情況下，如果欄位的值不是正確的日期類型，則在表單提交時會自動提示“必須是日期型數(shù)據(jù)”（第六參數(shù)的第二個值）。若XMLTitle欄位第二參數(shù)內(nèi)的值為N（數(shù)字）格式，且相對應(yīng)的第四參數(shù)為“y”的情況下，如果欄位的值不是正確的數(shù)字類型，則在表單提交時會自動提示“必須是數(shù)字型數(shù)據(jù)”（第六參數(shù)的第三個值）。動態(tài)表格的計算以“員工績效考核表”為例，如圖所示：項目a1的工作權(quán)重乘以考核得分加上a2的工作權(quán)重乘以考核得分再加上……….，然后把結(jié)果統(tǒng)計在動態(tài)表格下面的欄位里。對于上面的計算則要進(jìn)行一下設(shè)置：（1）將XMLTitle欄位第二參數(shù)的第二列和第三列置為“N”，如：“TEXT,N,N,TEXT,”。（2）在JS表頭里添加下面兩段函數(shù)：functionhenxiang_calcu(item,Dis_XMLContents_name)///對“工作權(quán)重、考核得分”內(nèi)容的檢測{if(Dis_XMLContents_name=="XMLContents"){if((parseFloat(item[1].value)>100)|(parseFloat(item[1].value)<0))///判斷值是否在0-100之間{msgBox("工作權(quán)重請輸入0-100之間的數(shù)字",1)returnfalse}if((parseFloat(item[2].value)>100)|(parseFloat(item[2].value)<0))///判斷值是否在0-100之間{msgBox("考核得分請輸入0-100之間的數(shù)字",1)returnfalse}}}functionzhongxiang_calcu(Dis_XMLContents_name)///對動態(tài)表格進(jìn)行統(tǒng)計{if(Dis_XMLContents_name=="XMLContents")///判斷當(dāng)前輸入的值與XMLContents是否相等{varTemp_v=document.all(Dis_XMLContents_name).value///若相等則付給Temp_vvara1,a2a1=0a2=0a3=0Temp_v=Temp_v.split("^")//////取出當(dāng)前一行動態(tài)表格的值for(varMM=0;MM<Temp_v.length-1;MM++){varTempi=Temp_v[MM]Tempi=Tempi.split("~")///取出每一個欄位的值付給Tempifor(varj=0;j<Tempi.length-1;j++) {temp_va=Tempi[j] if(!isNaN(temp_va)){if(j==1)///如果是在第二列，則將值付給a1{a1=parseFloat(temp_va) } if(j==2){a2=parseFloat(temp_va)*a1/100///將第三列的值乘以a1/100付給a2(統(tǒng)計一行的值) a3=a3+a2///對每一行的總和進(jìn)行相加付給a3} } }}document.forms(0).SUMFRACTION.value=a3///將統(tǒng)計和付給SUMFRACTION欄位 }}精品文檔精心整理精品文檔可編輯的精品文檔表格製作說明一般規(guī)定：表格需以定義於<table>….</table>間表格內(nèi)容以『列(row)先行(column)後』的方式依序編寫。表格中的一列需以定義於<tr>….</tr>間，tr為tablerow的縮寫。資料項目需以定義於<td>….</td>間，td為tabledata的縮寫，唯</td>可省略。表格的編碼步驟1、先繪一表格草圖如：甲乙12342.於表格前後，先加上<table>及</table>，如：<table>甲乙1234</table>3.於表格的每一列的前後，先加上<tr>及</tr>，如：<table><tr>甲乙</tr><tr>12</tr><tr>34</tr></table>4.於表格的每一欄位資料的前後，加上<td>及</td>，如：<table><tr><td>甲</td><td>乙</td></tr><tr><td>1</td><td>2</td></tr><tr><td>3</td><td>4</td></tr></table>5.將框線去除即得<table><tr><td>甲</td><td>乙</td></tr><tr><td>1</td><td>2</td></tr><tr><td>3</td><td>4</td></tr></table>6.上述之實例表格的實例表格製作說明一.htm

表格框線上例中所顯示的表格無框線，可於<table>內(nèi)加入border屬性border屬性說明格式：border=數(shù)字?jǐn)?shù)字愈大框線愈粗，該選項不寫或數(shù)值為0時，表無框線。依瀏覽器的功能可能會有所不同：若【border=數(shù)字】不寫，在有底色時，顏色區(qū)塊是連續(xù)的。若【border=0】，在有底色時，欄位顏色區(qū)塊是不連續(xù)的(有欄位的格線)。<BODY><tableborder=1><tr><td>甲</td><td>乙</td></tr>..</table></BODY></HTML>border屬性的應(yīng)用實例表格製作說明2-1.htmborder=1表格製作說明2-2.htmborder=3

表格空白欄之處理因HTML對白空白(whiteblank)的處理方式可以中文之「全型空白」用其提供的空白特殊符號「 」(Non-BlankSPace)，同於資料內(nèi)有“>”(大於符號)時，需使用「>」(greater)一樣。

表格背景顏色bgcolor屬性說明格式：bgcolor=“顏色名”|”#rrggbb"例如：bgcolor="silver"bgcolor="#ff0000"代表純紅因紅色全用，綠色和藍(lán)色無背景顏色屬性可以放在<table><tr><td>標(biāo)籤內(nèi)例如：<tablebgcolor="silver">整個表格的背景顏色為銀色，除非<tr><td>有另外指定。<trbgcolor="#ff0000">本例的背景顏色為正紅色，除非<td>有另外指定。<tdbgcolor="blue">本例的背景顏色為藍(lán)色，可變更<tr><td>的指定。表格的框線由<table>的bgcolor所決定，無法由<tr>、<td>變更，若要變更可使用DHTML。bgcolor屬性的應(yīng)用實例<HTML><HEAD><TITLE>表格背景顏色練習(xí)一</TITLE></HEAD><BODY><tablebgcolor="silver"border=1><tr><td>甲</td><td>乙</td></tr><trbgcolor="ff0000"><tdbgcolor="blue">1</td><td>2</td></tr><tr><td>3</td><td>4</td></tr></table><br></BODY></HTML>表格製作背景顏色說明.htm

表格欄位的長寬border屬性width和height屬性說明格式：width="整數(shù)"|"整數(shù)%""整數(shù)"：表示寬度為"整數(shù)"個像素(pixel)點。"整數(shù)%"：表示寬度的佔可分配的"整數(shù)比率"。以該視窗或框頁所分配到螢?zāi)坏拇笮?00%。height="整數(shù)""整數(shù)"：表示高度為"整數(shù)"個像素(pixel)點。"整數(shù)%"：表示高度的佔可分配的"整數(shù)比率"。例如：width="100"width="10%"height="20"height="20%"以該視窗或框頁所分配到螢?zāi)坏拇笮。▽?、高）?00%。若指明200%，則大小為分配到螢?zāi)淮笮〉?倍。長寬屬性可以放在<table><tr><td>標(biāo)籤內(nèi)但同一個行（COLumn）的寬度是相同的，同一個列（ROW）的高度是相同的。例如：<tablewidth="100">整個表格的寬度為100個像素(pixel)點。<tablewidth="100%">整個表格的寬度為可分配的全部。續(xù)上例width和height屬性的應(yīng)用實例下例為一個全畫面的表格（可以隨視窗大小而調(diào)變）。其欄位比率分別為20%30%20%50%50%<HTML><HEAD><TITLE>表格的寬和高</TITLE></HEAD><BODY><tablebgcolor="silver"border=1width="100%"height=”100%”><trheight=”20%”><td>甲</td><td> </td><td>乙</td></tr><trheight=”30%”><tdwidth="30%">1</td><tdwidth="20%">x</td><tdwidth="50%">2</td></tr><trheight=”50%”><td>3</td><td> </td><td>4</td></tr></table><br></BODY></HTML>表格製作w-and-h說明.htm

表格跨欄colspan和rowspan屬性說明格式：colspan=“整數(shù)”跨行合併：該欄位合併後繼“整數(shù)”欄位（同列）。rowspan==“整數(shù)”跨列合併：該欄位合併在其下方後繼“整數(shù)”欄位（同行）。例如：<tdcolspan=2>和同列後繼欄位合併成一欄（共2格）。<tdrowspan=3>和同行後繼二個欄位合併成一欄（共3格）。<tdrowspan=3colspan=2>和同列後繼欄位及和同行後繼二個欄位合併成一欄（共6格）。屬性的應(yīng)用實例下列表格姓名性別e-mail<tdcolspan=2><tdrowspan=2>住址<tdcolspan=2>參考表格的編碼步驟編碼的次序由左至右，被合併的欄位不需有任何的標(biāo)籤。<HTML><HEAD><meta-equiv="content-type"content="text/html;charset=big5"><TITLE>表格的跨欄製作說明</TITLE></HEAD><BODY><tableborder=1><tr><td>姓名</td><tdwidth="60"> </td><td>性別</td><tdwidth="60"> </td></tr><tr><td>e-mail</td><tdcolspan="2"> </