首页 > 代码库 > 文字游戏

文字游戏

技术分享
/** * 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

 

文字游戏