文字游戏
/*** Created by 年浩 on 2016/11/5.*/ if(jQuery){var check=function(){//alert("dfs");console.log("执行函数");var answerString="";var answers=$(":checked");answers.each(function(i){answerString=answerString+answers[i].value;});$(":checked").each(function(i){var answerString=answerString+answers[i].value;});console.log(answerString);//alert(answerString); checkIfCorrect(answerString);};var checkIfCorrect=function(theString){if(parseInt(theString,16)==45812984490){$("body").addClass("correct");$("h1").text("YOU WIN");$("canvas").show();}};//alert("sdfs"); console.log(check);$("#q1").show(); }; if(impress){$("#q2").show(); }; if(atom){$("#q3").show(); }; if(createjs){$("#q4").show(); };if(require){$("#q6").show(); }; if($().playground){$("#q7").show(); }; if(jaws){$("#q8").show(); } if(enchant){$("#q9").show(); }; if(Crafty){$("#q10").show(); };View Code
首先给出game.js,当玩家完成全部的题目后,如果结国正确,修改body 的class,当然我们以也可以做其他的很多事.
关键代码:
var check=function(){//alert("dfs");console.log("执行函数");var answerString="";var answers=$(":checked");answers.each(function(i){answerString=answerString+answers[i].value;});$(":checked").each(function(i){var answerString=answerString+answers[i].value;});console.log(answerString);//alert(answerString); checkIfCorrect(answerString);};var checkIfCorrect=function(theString){if(parseInt(theString,16)==45812984490){$("body").addClass("correct");$("h1").text("YOU WIN");$("canvas").show();}};//alert("sdfs"); console.log(check);
开始的时候,不知道为什么,点击body没有反应,所以加了几个alert跟log输出,看一眼.之后我加了一个button后,莫名其妙的自己好了.神经病啊!!
无所谓了,反正js就这个屁样.
我不知道这些题目的答案,所以就然他们全是A则认为答案全部正确（不要在意这些细节）。
除了jquery的框架，其他的框架都是以后用到的，这里就不多说了。不写也无所谓，直接显示所有的题目就好了。
下面给出html代码：
DOCTYPE html>
<html>
<head lang="en"><meta charset="UTF-8"><title>Quiztitle><link rel="stylesheet" type="text/css" href="main.css">
head>
<body onclick="check();"><h1>Quizh1><div id="quiz"><div id="q1"><div class="question">1,which is not a main file type that we use to make websites?div><input type="radio" name="q1" value="a"><label>.htmllabel><input type="radio" name="q1" value="b"><label>.exelabel><input type="radio" name="q1" value="c"><label>.jslabel><input type="radio" name="q1" value="d"><label>.csslabel>div><br><div id="q2"><div class="question">2,a javascript object is wrapped by what characters?div><input type="radio" name="q2" value="a"><label>[]label><input type="radio" name="q2" value="b"><label>;;label><input type="radio" name="q2" value="c"><label>{}label><input type="radio" name="q2" value="d"><label>()label>div><br><div id="q3"><div class="question">3,moles are which of the following?div><input type="radio" name="q3" value="a"><label>omnivorouslabel><input type="radio" name="q3" value="b"><label>adorablelabel><input type="radio" name="q3" value="c"><label>whackablelabel><input type="radio" name="q3" value="d"><label>all of abovelabel>div><br><div id="q4"><div class="question">4,in japanese "*" is pronounced...div><input type="radio" name="q4" value="a"><label>kalabel><input type="radio" name="q4" value="b"><label>kolabel><input type="radio" name="q4" value="c"><label>kelabel><input type="radio" name="q4" value="d"><label>kilabel>div><br><div id="q5"><div class="question">5,the gravitational constant on earth is approximately...div><input type="radio" name="q5" value="a"><label>10m/s^2label><input type="radio" name="q5" value="b"><label>.809m/s^2label><input type="radio" name="q5" value="c"><label>9.81m/s^2label><input type="radio" name="q5" value="d"><label>84.4/s^2label>div><br><div id="q6"><div class="question">6,45(in base 10) is that in binarydiv><input type="radio" name="q6" value="a"><label>101101label><input type="radio" name="q6" value="b"><label>110011label><input type="radio" name="q6" value="c"><label>.011101label><input type="radio" name="q6" value="d"><label>101011label>div><br><div id="q7"><div class="question">7,4<<2=?><input type="radio" name="q7" value="a"><label>16label><input type="radio" name="q7" value="b"><label>4label><input type="radio" name="q7" value="c"><label>2label><input type="radio" name="q7" value="d"><label>8label>div><br><div id="q8"><div class="question">8,given the lengths of two sides of a right triangle(ont with a 90 degee angle),how would you find the hypotenusediv><input type="radio" name="q8" value="a"><label>Pi*Radius^2label><input type="radio" name="q8" value="b"><label>Pythagorean theoremlabel><input type="radio" name="q8" value="c"><label>calculatorlabel><input type="radio" name="q8" value="d"><label>sin(side1+side2)label>div><br><div id="q9"><div class="question">9 true of false:all games must run at at least 60 frames per second to be any gooddiv><input type="radio" name="q9" value="a"><label>truelabel><input type="radio" name="q9" value="b"><label>falselabel>div><br><div id="q10"><div class="question">10 using a server can help you to div><input type="radio" name="q10" value="a"><label>hide you codelabel><input type="radio" name="q10" value="b"><label>have a performant gamelabel><input type="radio" name="q10" value="c"><label>create shared experiences for playerslabel><input type="radio" name="q10" value="d"><label>all of the abovelabel>div><br>div><script src="jquery.js">script><script src="impress.js">script><canvas>canvas><script src="atom.js">script><script src="easel.js">script><script src="yabble.js">script><script src="jquery.gamequery.js">script><script src="jaw.js">script><script src="enchant.min.js">script><script src="crafty.js">script><script src="game.js">script>
body>
html> View Code 最后是一些无关紧要的css代码。。
body{margin-left: 50px;} div,input{font-size: 24px; } #q1,#q2,#q3,#q4,#q5, #q6,#q7,#q8,#q9,#q10{display: none; } canvas{display: none; } .correct{background-color:red;color:green; }View Code
转载于:https://www.cnblogs.com/superxuezhazha/p/6040881.html
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！