當(dāng)前位置：軟件學(xué)堂 > 資訊首頁(yè) > 網(wǎng)絡(luò)編程 > 編程其他 > JS編寫(xiě)多選考試題

JS編寫(xiě)多選考試題

2012/11/9 19:18:58作者：佚名來(lái)源：網(wǎng)絡(luò)

移動(dòng)端

【實(shí)例名稱】

JS編寫(xiě)多選考試題

【實(shí)例描述】

隨著網(wǎng)絡(luò)的普及，在線考試的應(yīng)用越來(lái)越廣泛。本例學(xué)習(xí)如何制作包含多項(xiàng)選擇的考試題。

【實(shí)例代碼】

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>標(biāo)題頁(yè)-學(xué)無(wú)憂（denvermotorcycleaccidentlawyer.com）</title>
<Script Language="javascript">
function selectV(obj)
{
 try{ 
 var oTd = obj.parentElement; 
//獲取表格的列
 var oTr = oTd.parentElement; 
//獲取表格的行
 var oTable = oTr.parentElement;
//獲取表格
 var oTd_Answer = oTable.rows[oTr.rowIndex-1].cells[0].innerText; 
//獲取問(wèn)題答案所在的單元格內(nèi)容
 var oBegin = oTd_Answer.indexOf("（") + 1; 
//獲取（所在的位置
 var str = '';
 for(var i=0;i<oTd.children.length;i++){
//遍歷問(wèn)題選項(xiàng)
 if(oTd.children[i].tagName=='INPUT' && oTd.children[i].checked){
//如果選中
str += oTd.children[i].value; //輸出value值
 }
 }//輸出結(jié)束符號(hào)）
 oTable.rows[oTr.rowIndex-1].cells[0].innerText = 
oTd_Answer.substring(0,oBegin) + str + '）';
 }catch(error){
 window.alert(error.description); 
//顯示錯(cuò)誤信息
 }
}
</Script>
</head>
<body>
<table>
 <tr>
 <td>1.你喜歡的國(guó)家（）</td>
 </tr>
 <tr>
 <td>
 <input type="checkbox" value="A" onclick="selectV(this);">A、北京<br>
 <input type="checkbox" value="B" onclick="selectV(this);">B、東京<br>
 <input type="checkbox" value="C" onclick="selectV(this);">C、紐約<br>
 <input type="checkbox" value="D" onclick="selectV(this);">D、韓國(guó)
 </td>
</tr>
 <tr>
 <td>2.你喜歡的顏色（）</td>
 </tr>
 <tr>
 <td>
 <input type="checkbox" value="A" onclick="selectV(this);">A、黑色<br>
 <input type="checkbox" value="B" onclick="selectV(this);">B、白色<br>
 <input type="checkbox" value="C" onclick="selectV(this);">C、紅色<br>
 <input type="checkbox" value="D" onclick="selectV(this);">D、藍(lán)色
 </td>
</tr>
</table></body>
</html>

【運(yùn)行效果】

 多選考試題運(yùn)行效果

【難點(diǎn)剖析】

本例熟練運(yùn)用DOM實(shí)現(xiàn)單元格的獲取?！皃arentElement”屬性用來(lái)獲取當(dāng)前元素的父元素。獲取單元格內(nèi)容使用的是“cells[0].innerText”屬性。本例還使用了字符串對(duì)象的一些操作方法。“indexOf”方法用來(lái)獲取指定字符在字符串中的位置，“substring”方法用來(lái)截取從指定開(kāi)始位置到指定結(jié)束位置之間的字符串。

【源碼下載】

為了JS代碼的準(zhǔn)確性，請(qǐng)點(diǎn)擊：JS編寫(xiě)多選考試題 進(jìn)行本實(shí)例源碼下載 

標(biāo)簽： JS編寫(xiě)  考試