分享一個jQuery的小測驗(Quiz)插件:jQuizzy

偶然發(fā)現(xiàn)一個非常不錯的生成在線測試的jQuery插件 - jQuizzy,這個插件能夠幫助你快速的生成一個非常漂亮的在線測試應(yīng)用。
主要特性:
- 界面非常整潔漂亮
- 界面互動
- 同一個頁面多個測試題
- 無需HTML。通過簡單的javascript定義測試問題
- 完全支持定制,皮膚并且可以擴展
- 商業(yè)使用需要付費15美金
Javascript
倒入類庫及其問題js:
<script src="js/init.js"></script>
<script src="js/jquery.js"></script>
<script src="js/jquery.jquizzy-min.js"></script>
HTML中調(diào)用如下JS:
<script>
$('#quiz-container').jquizzy({
questions: init.questions,
resultComments: init.resultComments,
twitterStatus: 'Woo! I got {score} on the quiz. Try it! http://bit.ly/linky'
});
</script>
init.js內(nèi)容如下:
var init = {
'questions': [
{
'question': 'jQuery is a...',
'answers': ['JavaScript library','Ruby Gem','PHP Framework','None of the above'],
'correctAnswer': 1
},
{
'question': 'jQuery uses CSS selectors and XPath expressions to select elements?',
'answers': ['false','true'],
'correctAnswer': 2
},
{
'question': 'What scripting language is jQuery written in?',
'answers': ['C','C#','javascript','java'],
'correctAnswer': 3
}
],
'resultComments' :
{
perfect: 'Albus, is that you?',
excellent: 'Outstanding, noble sir!',
good: 'Exceeds expectations!',
average: 'Acceptable. For a muggle.',
bad: 'Well, that was poor.',
poor: 'Dreadful!',
worst: 'For shame, troll!'
}
};
搞定!非常簡單,你自己可以設(shè)計自己的風(fēng)格!via gbin1.com
歡迎訪問GBin1.com


浙公網(wǎng)安備 33010602011771號