HTML多个表单,包含2个javascripts

时间:2016-05-24 04:14:13

标签: javascript jquery html html5

首先我是javascript和html的新手,为一个需要大学的项目做这个,所以这个网站开发不是我的强项。 问题是:

我在同一个html文件上有2个测验,每个文件都有2个javascript文件。

    <form name="quiz">
    1. listen to pronunciation...<br>
    <input type="radio" name="q1" value="a">Pedro<br>
   <img src="images/ANIMALES/8.png" width="100" height="100" /> <br>  
    <input type="radio" name="q1" value="b">Juan<br>
    <img src="images/ANIMALES/8.png" width="100" height="100" /> <br>  
    <input type="radio" name="q1" value="c">Luis<br>
    <img src="images/ANIMALES/8.png" width="100" height="100" /> <br>  
    <p>


    <input type="button" value="Get score" onClick="getScore(this.form)">
    <input type="reset" value="Clear"><p>
    Score = <input type=text size=15 name="percentage"><br>
    Correct answers:<br>
    <textarea name="solutions" wrap="virtual" rows="4" cols="40"></textarea>
    </form>

在同一个html页面中

       <form name="quiz2">
        1. listen to pronunciation...<br>
        <input type="radio" name="q2" value="a">Pedro<br>
       <img src="images/ANIMALES/8.png" width="100" height="100" /> <br>  
        <input type="radio" name="q2" value="b">Juan<br>
        <img src="images/ANIMALES/8.png" width="100" height="100" /> <br>  
        <input type="radio" name="q2" value="c">Luis<br>
        <img src="images/ANIMALES/8.png" width="100" height="100" /> <br>  
        <p>


        <input type="button" value="Get score2" onClick="getScore2(this.form)">
        <input type="reset" value="Clear"><p>
        Score = <input type=text size=15 name="percentage"><br>
        Correct answers:<br>
        <textarea name="solutions" wrap="virtual" rows="4" cols="40"></textarea>
        </form>

javascripts文件是javascript1.js和javascript2.js(在测验html生成器中找到的那些)

var numQues = 1;
var numChoi = 3;

var answers = new Array(5);
answers[0] = "b";



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.percentage.value = score + "%";

  var correctAnswers = "";
  for (i=1; i<=numQues; i++) {
    correctAnswers += i + ". " + answers[i-1] + "\r\n";
  }
  form.solutions.value = correctAnswers;

}

和第二个

var numQues = 1;
var numChoi = 3;

var answers = new Array(5);
answers[0] = "a";


function getScore2(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.percentage.value = score + "%";

  var correctAnswers = "";
  for (i=1; i<=numQues; i++) {
    correctAnswers += i + ". " + answers[i-1] + "\r\n";
  }
  form.solutions.value = correctAnswers;

}

然而,两种形式总是采用相同的答案(“a”),一个应该是正确答案“b”,另一个是“a”, 任何线索我做错了什么?

1 个答案:

答案 0 :(得分:1)

您的变量具有相同的名称并且在相同的范围内。他们互相压倒。