onClick 的 Javascript 2 函数

Question

我是 Javascript 新手，所以请多多包涵。我有一个 Javascript 测验，它收集答案并在测验结束时显示分数。分数是根据表单末尾的“onClick”命令事件计算的，然后我想将其解析为事件跟踪到谷歌分析。目前，如果我尝试将分数的值解析为分析，则单击该按钮时，它将无法正常工作。如果变量是另一个定义的整数（具有固定值），则完全相同的方法确实有效。

这是我的代码：

var numQues = 5;    
var numChoi = 3;   
var url = location.href;  
var score = 0;  
var answers = new Array(5);  
answers[0] = "Play your pet a CD";  
answers[1] = "National PetLog database";  
answers[2] = "Certain types of cancers";  
answers[3] = "A few weeks";  
answers[4] = "Up to 1 year";  

function getScore(form) {  
 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;  
        }  
      }  
    }  
  }  
  form.score.value = score + "/" + numQues;  
  var correctAnswers = "";  
  for (i=1; i<=numQues; i++) {  
    correctAnswers += i + ". " + answers[i-1] + "\r\n";  
  }  
  form.solutions.value = correctAnswers;  


}  

function JavaScriptFunction(){  
  return(score);  
}

按钮是：

<input class="ScoreButton" onclick="getScore(this.form); pageTracker._trackEvent('Quiz', 'Petcare quiz', url, score);" type="button" value="Get score" />

任何帮助将不胜感激。

Answer 1

既然你说你是 JavaScript 新手，那么我会强烈推荐使用好的 JavaScript 库，如 jQuery、YUI、Dojo、Prototype 等。有很多好的库可供选择。这样的库将大大简化您与 DOM 和浏览器事件模型的交互。我只向对 JavaScript、DOM 以及所有浏览器怪癖和不兼容问题非常有经验的人推荐不要使用 JavaScript 库。

如果您出于某种原因不想使用库，请阅读以下内容：

What are some empirical technical reasons not to use jQuery?

Answer 2

您没有将值发送到跟踪器，试试这个：

<input class="ScoreButton" onclick="doStuff(this.form);" type="button" value="Get score" />

编辑：

function getScore(form) {  
 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 && currSelection.value == answers[i]) {  
          score++;  
          break;  
      }  
    }  
  }

  return score;  
}

function doStuff(form){
   //calculate score
   score = getScore(form);

   //replace value
   form.score.value = score + "/" + numQues;  

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

   //send data to track
   pageTracker._trackEvent('Quiz', 'Petcare quiz', url, score);
}

编辑：我对您的代码进行了一些重构。也许这种方式有效或可以找到错误所在。

Answer 3

您应该使用事件处理程序，而不是使用 onclick 属性。

<input id="score-button" type="button" value="Get Score">

然后在javascript中...

var scoreButton = document.getElementById('score-button');
scoreButton.addEventListener('click', myFuncOne(), false);
scoreButton.addEventListener('click', myFuncTwo(), false);

当然，就像其他建议提到的那样，您确实应该使用 jQuery 等 JavaScript 库，它提供了许多让您的生活更轻松的工具。

在 jQuery 中，上面的代码可以短到...

$('#score-button').click(function() {
  myFuncOne();
  myFuncTwo();
});