0

簡単な 10 問のクイズを書こうとしています。ただし、問題が発生しています。送信ボタンをクリックした後、採点用のコードを実行できません。誰か助けてくれませんか?

HTML コード:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>Quiz #1</title>

<link href="quiz.css" rel="stylesheet" type="text/css" />
<link href="reset.css" rel="stylesheet" type="text/css" />

<script src="quiz.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"
type="text/javascript"></script>

</head>

<body>

<div class="center">

<div id="questionContainer">

<div id="header">
    <h1>State Capitol Quiz</h1>
</div>

<div id="left">

<form action="quiz.html" class="container">
<div class="blank">
<br />
    <br />
        <p id="one">1.&nbsp; &nbsp;&nbsp;&nbsp;What is the capitol of Michigan?<br />
            <div class="tab">
                <input type="radio" name="question" value="A" />&nbsp;Lansing<br />
                <input type="radio" name="question" value="B" />&nbsp;Richmond<br />
                <input type="radio" name="question" value="C" />&nbsp;Austin<br />
                <input type="radio" name="question" value="D" />&nbsp;Columbus<br />
            </div>
        </p>
</div>
</form>

<form action="quiz.html" class="container">
<div class="blank">
<br />
<br />
    <p id="two">2.&nbsp; &nbsp;&nbsp;&nbsp;What is the capitol of Virginia?<br />
       <div class="tab">
            <input type="radio" name="question" value="A" />&nbsp;Lansing<br />
            <input type="radio" name="question" value="B" />&nbsp;Richmond<br />
            <input type="radio" name="question" value="C" />&nbsp;Lincoln<br />
            <input type="radio" name="question" value="D" />&nbsp;Reno<br />
      </div>
   </p>
</div>
</form>

<form action="quiz.html" class="container">
<div class="blank">
<br />
<br />
    <p id="three">3.&nbsp; &nbsp;&nbsp;&nbsp;What is the capitol of Arkansas?<br />
        <div class="tab">  
            <input type="radio" name="question" value="A" />&nbsp;Dallas<br />
            <input type="radio" name="question" value="B" />&nbsp;Lincoln<br />
            <input type="radio" name="question" value="C" />&nbsp;Little Rock<br />
            <input type="radio" name="question" value="D" />&nbsp;Cheyene<br />
        </div>
    </p>
</div>
</form>

<form action="quiz.html" class="container">
<div class="blank">
<br />
<br />
    <p id="four">4.&nbsp; &nbsp;&nbsp;&nbsp;What is the capitol of Arizona?<br />
        <div class="tab"> 
            <input type="radio" name="question" value="A" />&nbsp;Juneau<br />
            <input type="radio" name="question" value="B" />&nbsp;Honolulu<br />
            <input type="radio" name="question" value="C" />&nbsp;Pheonix<br />
            <input type="radio" name="question" value="D" />&nbsp;Toledo<br />
        </div>
    </p>
</div>
</form>

<form action="quiz.html" class="container">
<div class="blank">
<br />
<br />
    <p id="five">5.&nbsp; &nbsp;&nbsp;&nbsp;What is the capitol of Florida?<br /> 
        <div class="tab"> 
            <input type="radio" name="question" value="A" />&nbsp;Oakland<br />
            <input type="radio" name="question" value="B" />&nbsp;Kansas City<br />
            <input type="radio" name="question" value="C" />&nbsp;Tallahassee<br />
            <input type="radio" name="question" value="D" />&nbsp;Miami<br />
        </div>
    </p>
</div>
</form>

<form action="quiz.html" class="container">
<div class="blank">
<br />
<br />
    <p id="six">6.&nbsp; &nbsp;&nbsp;&nbsp;What is the capitol of Nebraska?<br />
        <div class="tab">  
            <input type="radio" name="question" value="A" />&nbsp;Omaha<br />
            <input type="radio" name="question" value="B" />&nbsp;Lincoln<br />
            <input type="radio" name="question" value="C" />&nbsp;Sacramento<br />
        <input type="radio" name="question" value="D" />&nbsp;Sab Diego<br />
        </div>
    </p>
</div>
</form>
</div>

<div id="right">
<form action="quiz.html" class="container">
<br />
<br />
<div class="blank">
    <p id="seven">7.&nbsp; &nbsp;&nbsp;&nbsp;What is the capitol of Texas?<br />
        <div class="tab">    
            <input type="radio" name="question" value="A" />&nbsp;Fortworth<br />
            <input type="radio" name="question" value="B" />&nbsp;Richmond<br />
            <input type="radio" name="question" value="C" />&nbsp;Austin<br />
            <input type="radio" name="question" value="D" />&nbsp;Las Vegas<br />
        </div>
    </p>
</div>
</form>

<form action="quiz.html" class="container">
<div class="blank">
    <p id="eight">8.&nbsp; &nbsp;&nbsp;&nbsp;What is the capitol of Alaska?<br />
        <div class="tab">   
            <input type="radio" name="question" value="A" />&nbsp;Tulsa<br />
            <input type="radio" name="question" value="B" />&nbsp;Oaklahoma City<br />
            <input type="radio" name="question" value="C" />&nbsp;Austin<br />
        <input type="radio" name="question" value="D" />&nbsp;Juneau<br />
        </div>
    </p>
</div>
</form>

<form action="quiz.html" class="container">
<div class="blank">
    <p id="nine">9.&nbsp; &nbsp;&nbsp;&nbsp;What is the capitol of Hawaii?<br /> 
        <div class="tab"> 
            <input type="radio" name="question" value="A" />&nbsp;Paris<br />
            <input type="radio" name="question" value="B" />&nbsp;Honolulu<br />
            <input type="radio" name="question" value="C" />&nbsp;Austin<br />
            <input type="radio" name="question" value="D" />&nbsp;Cadilac<br />
        </div>
    </p>
</div>
</form>

<form action="quiz.html" class="container">
<div class="blank">
    <p id="ten">10.&nbsp; &nbsp;&nbsp;&nbsp;What is the capitol of Ohio?<br />
        <div class="tab">   
            <input type="radio" name="question" value="A" />&nbsp;Cleveland<br />
            <input type="radio" name="question" value="B" />&nbsp;Green Bay<br />
            <input type="radio" name="question" value="C" />&nbsp;Austin<br />
            <input type="radio" name="question" value="D" />&nbsp;Columbus<br />
        </div>
    </p>
</div>
</form>

<div id="button">        
    <input type="submit" value="submit" />
</div>


</div>

</div>

</div>

</body>
</html>

Javascript:

$(document).ready(function(){

 $("#button").click(function(){

var numQues= 10;
var numChoices= 4;
var answers = new Array(10);

answers[0] = "Lansing";
answers[1] = "Richmond";
answers[2] = "Little Rock";
answers[3] = "Pheonix";
answers[4] = "Tallahassee";
answers[5] = "Lincoln";
answers[6] = "Austin";
answers[7] = "Juneau";
answers[8] = "Honolulu";
answers[9] = "Columbus";

function getScore(form){
    var score = 0;
    var currElt;
    var currSelection;
    for(i = 0; i<numQues; i++){
        currElt = i * numChoi;
        for(j = 0; j<numChoi; j++){
            currSelection = form.elements[currElt + j];
            if(currSelection.checked){
                if(currSelection.value == answers[i]){
                score++;
                break;
                }
            }
        }
    }

    score = math.round(score/numQues * 100);
    form.precentage.value = score + "&#37;";
    var corrAnswers = "";
    for(i = 1; i <numQues; i++){
        corrAnswers += i + "." + answers [i - 1] + "\r\n;"
    }
    form.solutions.value = corrAnswers/numQues * 100 + "%";}
});
});

もう 1 つ追加: スコア結果用に別のページを作成する必要がありますか?

ありがとう

4

2 に答える 2

1

これを変える

<div id="button">        
    <input type="submit" value="submit" />
</div>

<div id="buttondiv">        
    <input type="button" id="button" value="submit" />
</div>

そして見る

于 2013-04-22T04:03:17.890 に答える
0

送信の代わりにタイプボタンを使用してください。送信すると、フォームがサーバーに戻され、JavaScript が実行されなくなります。

<input id="myButton" type="button" value="submit" />

$("#myButton").click(function(){});
于 2013-04-22T04:03:52.260 に答える