CSS+jQuery如何實現(xiàn)的在線答題功能-創(chuàng)新互聯(lián)

小編給大家分享一下CSS+jQuery如何實現(xiàn)的在線答題功能,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!

成都創(chuàng)新互聯(lián)公司"三網(wǎng)合一"的企業(yè)建站思路。企業(yè)可建設(shè)擁有電腦版、微信版、手機(jī)版的企業(yè)網(wǎng)站。實現(xiàn)跨屏營銷,產(chǎn)品發(fā)布一步更新,電腦網(wǎng)絡(luò)+移動網(wǎng)絡(luò)一網(wǎng)打盡,滿足企業(yè)的營銷需求!成都創(chuàng)新互聯(lián)公司具備承接各種類型的成都做網(wǎng)站、網(wǎng)站制作項目的能力。經(jīng)過十年的努力的開拓,為不同行業(yè)的企事業(yè)單位提供了優(yōu)質(zhì)的服務(wù),并獲得了客戶的一致好評。

效果圖:


CSS+jQuery如何實現(xiàn)的在線答題功能

HTML

首先載入jquery庫文件和quiz.js以及所需的CSS樣式文件styles.css。



代碼如下:

<script src="jquery.js"></script> 
<script src="quiz.js"></script> 
<link rel="stylesheet" href="styles.css" />

然后在需要放置測試題的位置加入div#quiz-container。


代碼如下:

<div id="quiz-container"></div>

jQuery

首先,我們定義題目和答案選項,question是題目,answers是答案選項,correctAnswer是正確答案??梢钥闯龆x的init是一個json數(shù)據(jù)格式。



代碼如下:

var init={'questions':[{'question':'jQuery是什么?','answers':['JavaScript庫','CSS庫','PHP框架','以上都不是'],'correctAnswer':1},{'question':'找出不同類的一項?','answers':['寫字臺','沙發(fā)','電視','桌布'],'correctAnswer':3},{'question':'國土面積較大的國家是:','answers':['美國','中國','俄羅斯','加拿大'],'correctAnswer':3},{'question':'月亮距離地球多遠(yuǎn)?','answers':['18萬公里','38萬公里','100萬公里','180萬公里'],'correctAnswer':2}]};

接下來,我們直接調(diào)用quiz.js提供的插件方法,然后打開頁面是不是可以看到已經(jīng)在頁面上生成了一個在線測試項目。



代碼如下:

$(function(){     $('#quiz-container').jquizzy({         questions: init.questions     }); });

那么,要修改定制測試題樣式布局,可以到quiz.js和styles.css兩文件中做適當(dāng)修改。


疑問

到這里,細(xì)心的朋友就會發(fā)現(xiàn),問題來了:

1、直接將題目的正確答案標(biāo)記在js代碼中,是不是不安全?正規(guī)的測試項目答案是不是應(yīng)該在后臺判斷,以免有人查看源代碼直接獲取正確答案。

2、如何與后臺交互?比如測試答題前先驗證身份,答題完后將結(jié)果發(fā)送給后臺。


以上是“CSS+jQuery如何實現(xiàn)的在線答題功能”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對大家有所幫助,如果還想學(xué)習(xí)更多知識,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!

文章標(biāo)題:CSS+jQuery如何實現(xiàn)的在線答題功能-創(chuàng)新互聯(lián)
網(wǎng)頁URL:http://bm7419.com/article20/ihijo.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供App開發(fā)、網(wǎng)站導(dǎo)航網(wǎng)站策劃、網(wǎng)站內(nèi)鏈、微信公眾號定制網(wǎng)站

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

手機(jī)網(wǎng)站建設(shè)