2014-02-23 99 views
0

我收到了一个JavaScript onclick函数,它应该根据当前得分收听特定的标记。这是一个测验。 onlick函数监听正确答案的点击(拥有类的权利)。在beginnig中,函数应该听到的正确答案是第一个具有类权限的标签。在这个答案被点击之后,函数应该被执行并且问题改变并且分数被提高1。现在这个函数应该听第二个标签和正确的类。我得到了一个变量score2,它始终是选择正确的标签所需的值,但它并不工作。
守则:多次使用相同的javascript函数

var score = 0 
var score2 = 0 
    document.getElementById("go").onclick = function() { 
    score++; 
    console.log(score); 
    console.log(score2); 
    document.getElementById("head").style.display="inline"; 
    document.getElementById("question0").style.display="none"; 
    document.getElementById("question1").style.display="block"; 
}; 

document.getElementsByClassName("right")[score].onclick = function(){ 
score++; 
score2++; 
//console.log(score); 
console.log(score2); 
document.getElementById("question"+score2).style.display="none"; 
document.getElementById("question"+score).style.display="inline"; 
}; 

和HTML(测验是德国)

<!DOCTYPE html> 
<head> 
    <link rel="stylesheet" type="text/css" href="style.css"> 
</head> 
<body> 
    <div id="body"> 
    <div id="inbody"> 
    <div id="question0"> 
     <h1> 
      WELCOME TO THE 100 QUESTION GAME! 
     </h1> 

     <h2 id="go" style="color:pink"> 
     Lets GO! 
    </h2> 
    <p> 
     by strawberry studios 
    </p> 

</div> 

<div id="head" style="display:none;"> 
    <h1>THE 100 QUESTION GAME</h1> 
</div> 


<div id="question1" style="display:none;"> 
    <h3> 
     Von wo aus kann man nur nach S&uuml;den gehen? 
    </h3> 
    <br> 
    <br> 
    <a id="questionOneAnswerOne" class="right">Nordpol</a> <br> <!--Richtig--> 
    <a id="questionOneAnswerTwo" class="wrong" href="http://100questiongame.tk/index.html">S&uuml;dpol</a> <br> 
    <a id="questionOneAnswerThree" href="http://100questiongame.tk/index.html" class="wrong">&Auml;quator</a> <br> 
    <a id="questionOneAnswerFour" class="wrong" href="http://100questiongame.tk/index.html">Bayern</a> <br> 
</div> 

<div id="question2" style="display:none;"> 
    <h3> 
     Was ist am teuersten? 
    </h3> 
    <br> 
    <br> 
    <a id="questionTwoAnswerOne" href="http://100questiongame.tk/index.html" class="wrong">Diamant</a> <br> 
    <a id="quoestionTwonswerTwo" href="http://100questiongame.tk/index.html" class="wrong">Platin</a> <br> 
    <a id="questionTwoAnswerThree" href="http://100questiongame.tk/index.html" class="wrong">Gold</a> <br> 
    <a id="questionTwoAnswerFour" class="right">Osmium</a> <br> <!--Richtig--> 
</div> 

<div id="question3" style="display:none;"> 
    <h3> 
     Wof&uuml;r steht HTML? 
    </h3> 
    <br> 
    <br> 
    <a id="questionThreeAnswerOne" href="http://100questiongame.tk/index.html" class="wrong">Hyper Text Multiple Language</a> <br> 
    <a id="questionThreeAnswerTwo" href="http://100questiongame.tk/index.html" class="wrong">Hyper Text Markup Language</a> <br> <!--Richtig--> 
    <a id="questionThreeAnswerThree" class="right">Hydrotecinmultiliquid</a> <br> 
    <a id="questionThreeAnswerFour" href="http://100questiongame.tk/index.html" class="wrong">Hype The Mother (a)lLong<a/> <br> 
</div> 

<div id="question4" style="display:none;"> 
    <h3> 
     Welche Farbe h&auml;tte Cola ohne Farbstoffe? 
    </h3> 
    <br> 
    <br> 
    <a id="questionFourAnswerOne" href="http://100questiongame.tk/index.html" class="wrong">Gelb</a> <br> 
    <a id="questionFouranswerTwo" href="http://100questiongame.tk/index.html" class="wrong">Erdbraun</a> <br> 
    <a id="questionFourAnswerThree" class="right">Grün</a> <br> <!--Richtig--> 
    <a id="questionFourAnswerFour" href="http://100questiongame.tk/index.html" class="wrong">Türkis<a/> <br> 
</div> 

<div id="question5 "tyle="display:none;"> 

</div> 

<div id="question6" style="display:none;"> 

</div> 

<div id="question7" style="display:none;"> 

</div> 

<div id="question8" style="display:none;"> 

</div> 

<div id="question9" style="display:none;"> 

</div> 

<div id="question10" style="display:none;"> 

</div> 

<script type="text/javascript" src="javascript.js"></script> 
</div> 
</div> 
</body> 

http://100questiongame.tk测试代码并进入https://floobits.com/BenBals/quiz.sublime-project到现场查看代码为我编辑。

回答

2

这是一个办法做到这一点:

演示:http://jsfiddle.net/97gCk/3/

<div id="question1" style="display:none"> 
    <h3> 
     Von wo aus kann man nur nach S&uuml;den gehen? 
    </h3> 
    <br><br> 
    <a id="question1_1" onclick="nextQuestion(this)" href="#">Nordpol</a><br> 
    <a id="question1_2" class="wrong" href="..">S&uuml;dpol</a><br> 
    <a id="question1_3" class="wrong" href="..">&Auml;quator</a><br> 
    <a id="question1_4" class="wrong" href="..">Bayern</a><br> 
</div> 

JS

var score = 1; 

document.getElementById("go").onclick = function() { 
    document.getElementById("go").style.display="none"; 
    document.getElementById("question"+score).style.display="block"; 
}; 

function nextQuestion (el){ 
    el.style.color="green"; 
    document.getElementById("question"+score).style.display="none"; 
    score++; 
    document.getElementById("question"+score).style.display="inline";  
}; 
+0

,因为我是新来的有什么样谢谢起作用。 – Ben

+0

不,没有,只是写你的消息评论海报或答案海报评论。 – LGSon

相关问题