在本章中,我們將對“在線小測試”程序作兩處修改。一是允許用戶首先選擇回答完問題所需要的時間,二是允許用戶選擇要回答多少個問題。
要把“在線小測試”程序轉換為一個基於計時器的程序,只需修改兩個頁面,即QuizPage.htm頁面和GlobalFunctions.htm頁面。
首先,需要修改的是QuizPage.htm頁面中小測試程序的開始表單,在新的程序中,將允許用戶選擇要回答多少個問題以及答題的時間限制。接下來,還要修改cmdStartQuiz_onclick()函數,使得當在cmdStartQuiz_onclick()函數中調用resetQuiz()函數時,能夠傳入兩個參數,一個參數表示答題的時間限制,另一個參數表示用戶選擇回答問題的數量。其中,resetQuiz()函數是定義在GlobalFunctions.htm頁面中的。
現在,我們討論一下GlobalFunctions.htm頁面本身,在GlobalFunctions.htm頁面中,需要修改resetQuiz()函數,以便根據用戶選擇的時間限制啟動一個計時器。另外,還需要創建兩個新的函數,以便對計時進行顯示和處理:一個函數將在浏覽器窗口的狀態欄中顯示剩余的時間以便提示用戶,另一個函數將處理當計時器到點時的情況。
首先,我們來修改QuizPage.htm頁面,將QuizPage.htm頁面在文本編輯器中打開。
在QuizPage.htm頁面中,frmQuiz表單目前僅包含一個按鈕,將該表單修改為如下所示的代碼:
<form name="frmQuiz">
<p>
Number of Questions <br>
<select name="cboNoQuestions" size="1">
<option value="3">3
<option value="5">5
</select>
</p>
<p>
Time Limit <br>
<select name="cboTimeLimit" size="1">
<option value="-1">No Time Limit
<option value="60">1 Minute
<option value="180">3 Minutes
<option value="300">5 Minutes
</select>
</p>
<input name=cmdStartQuiz type=button value="Start Quiz"
onclick="return cmdStartQuiz_onclick()">
</form>
在該表單中,添加了兩個新的<select>標記,以創建兩個下拉列表框。第一個下拉列表框允許用戶選擇願意回答多少個問題,第二個下拉列表框則允許用戶設置回答問題的時限。
接下來,修改頁面頂部的cmdStartQuiz_onclick()函數。
<script language=JavaScript>
function cmdStartQuiz_onclick()
{
var cboNoQuestions = document.frmQuiz.cboNoQuestions;
var noQuestions =
cboNoQuestions.options[cboNoQuestions.selectedIndex].value;