如何使用jQuery+PHP+MySQL來(lái)實(shí)現(xiàn)一個(gè)在線測(cè)試項(xiàng)目
本文將結(jié)合實(shí)例給大家介紹如何使用jQuery+PHP+MySQL來(lái)實(shí)現(xiàn)在線測(cè)試題，包括動(dòng)態(tài)讀取題目，答題完畢后臺(tái)評(píng)分，并返回答題結(jié)果。
在上一篇文章中，我們介紹了使用jQuery實(shí)現(xiàn)的測(cè)試題效果。那么本文將結(jié)合實(shí)例給大家介紹如何使用jQuery+PHP+MySQL來(lái)實(shí)現(xiàn)在線測(cè)試題，包括動(dòng)態(tài)讀取題目，答題完畢后臺(tái)評(píng)分，并返回答題結(jié)果。這是一篇WEB綜合應(yīng)用文章，建議閱讀本文的您應(yīng)該具備HTML，jQuery以及PHP和MySQL等基本知識(shí)。
quiz.php
在這里為了講解方便，我將php和HTML混寫在quiz.php文件中。首先和本站上篇文章：jQuery實(shí)現(xiàn)的測(cè)試答題功能一樣，載入jQuery庫(kù)和quizs.js文件，然后在適當(dāng)?shù)奈恢眉由蠝y(cè)試題html結(jié)構(gòu)。
?
1 <div id="quiz-container"></div>我們要在頁(yè)面加載的時(shí)候?qū)㈩}目信息讀取出來(lái)，并且給jQuery調(diào)用顯示。題目信息來(lái)自數(shù)據(jù)庫(kù)，我們可以先在數(shù)據(jù)表quiz中加入題目及其答案選項(xiàng)信息。
我們通過(guò)構(gòu)造SQL語(yǔ)句，使用PHP查詢數(shù)據(jù)庫(kù)，讀取題目和答案選項(xiàng)信息，注意這個(gè)時(shí)候我們不需要讀取正確答案。然后將題目信息以JSON格式賦給變量$json。
?
1 2 3 4 5 6 7 8 9 10 11 12 13 14 <?php include_once("connect.php");//連接數(shù)據(jù)庫(kù) $sql = "select * from quiz order by id asc"; $query = mysql_query($sql); //查詢數(shù)據(jù) while($row=mysql_fetch_array($query)){ $answers = explode('###',$row['answer']); //將答案選項(xiàng)分開 $arr[] = array( 'question' => $row['id'].'、'.$row['question'], //題目 'answers' => $answers //答案選項(xiàng) ); } $json = json_encode($arr); //轉(zhuǎn)換json格式 ?>我們得到了一串json格式的數(shù)據(jù)，然后就像上一篇文章介紹的一樣，調(diào)用jquizzy()，方法如下：
?
1 2 3 4 5 6 $(function(){ $('#quiz-container').jquizzy({ questions: <?php echo $json;?>, //試題信息 sendResultsURL: 'data.php' //結(jié)果處理地址 }); });這樣，我們?cè)賮?lái)運(yùn)行網(wǎng)頁(yè)quiz.php，是不是生成了一個(gè)測(cè)試題，查看源代碼，我們只能看到j(luò)son數(shù)據(jù)，卻不能看到試題對(duì)應(yīng)的答案部分。
data.php
在調(diào)用測(cè)試題的時(shí)候，有個(gè)選項(xiàng)sendResultsURL，它是在用戶打完題，點(diǎn)擊“完成”按鈕時(shí)，向后臺(tái)data.php發(fā)送一個(gè)Ajax交互請(qǐng)求，data.php會(huì)根據(jù)用戶的答題情況，比對(duì)正確答案，然后給出用戶所得分?jǐn)?shù)。
?
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 include_once("connect.php"); //連接數(shù)據(jù)庫(kù) $data = $_REQUEST['an']; //獲取答題信息 $answers = explode('|',$data); //分析數(shù)據(jù) $an_len = count($answers)-1; //題目數(shù) $sql = "select correct from quiz order by id asc"; $query = mysql_query($sql); //查詢表 $i = 0; $score = 0; //初始得分 $q_right = 0; //答對(duì)的題數(shù) while($row=mysql_fetch_array($query)){ if($answers[$i]==$row['correct']){ //比對(duì)正確答案 $arr['res'][] = 1; //正確 $q_right += 1; //正確答題數(shù)+1 }else{ $arr['res'][] = 0; //錯(cuò)誤 } $i++; } $arr['score'] = round(($q_right/$an_len)*100); //計(jì)算總得分 echo json_encode($arr);新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注
