jQuery在线问卷答题系统代码-创新互联

jQuery在线问卷答题系统代码是一款实用的jQuery答题插件，点击下一题切换带有淡入淡出效果。
有时在网页中要加入一个在线测试功能，例如在线调查，在线测试各类知识等应用，这类应用需要用到很多前后端技能。今天我给大家分享一个基于jQuery的前端应用——测试答题功能。
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是正确答案。可以看出定义的init是一个json数据格式。

var init={'questions':[{'question':'jQuery是什么？','answers':['JavaScript库','CSS库','PHP框架','以上都不是'],'correctAnswer':1},{'question':'找出不同类的一项?','answers':['写字台','沙发','电视','桌布'],'correctAnswer':3},{'question':'国土面积大的国家是：','answers':['美国','中国','俄罗斯','加拿大'],'correctAnswer':3},{'question':'月亮距离地球多远？','answers':['18万公里','38万公里','100万公里','180万公里'],'correctAnswer':2}]};
接下来，我们直接调用quiz.js提供的插件方法，然后打开页面是不是可以看到已经在页面上生成了一个在线测试项目。
 $(function(){   $('#quiz-container').jquizzy({    questions: init.questions   });  });
那么，要修改定制测试题样式布局，可以到quiz.js和styles.css两文件中做适当修改。
codego.net 代码摘抄

创新互联是一家以网络技术公司，为中小企业提供网站维护、做网站、网站建设、网站备案、服务器租用、申请域名、软件开发、小程序定制开发等企业互联网相关业务，是一家有着丰富的互联网运营推广经验的科技公司，有着多年的网站建站经验，致力于帮助中小企业在互联网让打出自已的品牌和口碑，让企业在互联网上打开一个面向全国乃至全球的业务窗口：建站服务电话：028-86922220

另外有需要云服务器可以了解下创新互联scvps.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。

网页名称：jQuery在线问卷答题系统代码-创新互联
分享链接：https://www.cdcxhl.com/article2/ehjic.html

成都网站建设公司_创新互联，为您提供微信小程序、标签优化、企业网站制作、外贸网站建设、动态网站、网站内链

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联