文字游戏
/*** 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>Quiz</title><link rel="stylesheet" type="text/css" href="main.css"> </head> <body onclick="check();"><h1>Quiz</h1><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>.html</label><input type="radio" name="q1" value="b"><label>.exe</label><input type="radio" name="q1" value="c"><label>.js</label><input type="radio" name="q1" value="d"><label>.css</label></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>omnivorous</label><input type="radio" name="q3" value="b"><label>adorable</label><input type="radio" name="q3" value="c"><label>whackable</label><input type="radio" name="q3" value="d"><label>all of above</label></div><br><div id="q4"><div class="question">4,in japanese "*" is pronounced...</div><input type="radio" name="q4" value="a"><label>ka</label><input type="radio" name="q4" value="b"><label>ko</label><input type="radio" name="q4" value="c"><label>ke</label><input type="radio" name="q4" value="d"><label>ki</label></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^2</label><input type="radio" name="q5" value="b"><label>.809m/s^2</label><input type="radio" name="q5" value="c"><label>9.81m/s^2</label><input type="radio" name="q5" value="d"><label>84.4/s^2</label></div><br><div id="q6"><div class="question">6,45(in base 10) is that in binary</div><input type="radio" name="q6" value="a"><label>101101</label><input type="radio" name="q6" value="b"><label>110011</label><input type="radio" name="q6" value="c"><label>.011101</label><input type="radio" name="q6" value="d"><label>101011</label></div><br><div id="q7"><div class="question">7,4<<2=?</div><input type="radio" name="q7" value="a"><label>16</label><input type="radio" name="q7" value="b"><label>4</label><input type="radio" name="q7" value="c"><label>2</label><input type="radio" name="q7" value="d"><label>8</label></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 hypotenuse</div><input type="radio" name="q8" value="a"><label>Pi*Radius^2</label><input type="radio" name="q8" value="b"><label>Pythagorean theorem</label><input type="radio" name="q8" value="c"><label>calculator</label><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 good</div><input type="radio" name="q9" value="a"><label>true</label><input type="radio" name="q9" value="b"><label>false</label></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 code</label><input type="radio" name="q10" value="b"><label>have a performant game</label><input type="radio" name="q10" value="c"><label>create shared experiences for players</label><input type="radio" name="q10" value="d"><label>all of the above</label></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
總結
- 上一篇： 从13届全国人大一次会议手电筒主笔能发现
- 下一篇： GOF之享元模式