Question

我有一个我一直在为学校项目工作的表单，我无法弄清楚JavaScript checkAnswer功能有什么问题。表单和所有按钮都有效，但是当我点击提交按钮时，所有加载的都是空白页面。我尝试过研究表单，但我无法弄清楚我的代码出错了。为什么不检查任何东西？

以下是我的index.html文件中的表单：

<script src="CheckForm.js"></script>

<form method="post" action="return checkAnswer(this, '1', 'Correct.html', 
'Incorrect.html');" name="quizForm" id="quizForm">

         <input type="radio" name="choice" value="1"/>
            <script>getMusician(answer1);</script><br/>

         <input type="radio" name="choice" value="2"/>
            <script>getMusician(answer2);</script><br/>

         <input type="radio" name="choice" value="3"/>
            <script>getMusician(answer3);</script><br/>

         <input type="radio" name="choice" value="4"/>
            <script>getMusician(answer4);</script><br/>

         <input type="submit" value="Submit"/>
        </form>

这是我的CheckForm.js文件中的代码：

function checkAnswer(quizForm, Answer, CorrectPage, IncorrectPage)
{
  var i = 0;
  var j = null;

  for(;i<quizForm.elements.length();i++)
  {
    if(quizForm.elements[i].value.checked)
      j = quizForm.elements[i].value;
  }

  if(j === null)
  {
    windows.alert("Please make a selection.");
    return false;
  }

  if(j == Answer)
  {
    document.location.href = CorrectPage;
  }
  else
  {
    document.location.href = IncorrectPage;
  }
  return false;
}

Answer 1

你不应该需要一个表格。看起来你正在创建一个静态网站，所以我会删除表单，其余的你非常接近。这是一个适合你的工作示例。

此外，您似乎正在创建某种测验网站。请注意，用户可以使用开发人员控制台查看正确答案（checkAnswer()方法的第一个输入） - 我认为值得一提。

function checkAnswer(answer, correctPage, incorrectPage) {
  var i = 0;
  var j = null;
  var inputs = document.getElementsByClassName('musician');
  for (var i = 0; i < inputs.length; i++) {
    if (inputs[i].checked)
      j = inputs[i].value;
  }

  if (j == null) {
    alert("Please make a selection.");
    return false;
  }

  if (j == answer) {
    console.log('CORRECT!')
    document.location.href = CorrectPage;
  } else {
    console.log('incorrect :(')
    document.location.href = IncorrectPage;
  }
}

<div id="inputContainer">
  <input type="radio" name="choice" class="musician" value="1" />musician 1
  <br/>

  <input type="radio" name="choice" class="musician" value="2" />musician 2
  <br/>

  <input type="radio" name="choice" class="musician" value="3" />musician 3
  <br/>

  <input type="radio" name="choice" class="musician" value="4">musician 4
  <br/>
</div>
<input type="button" onclick="checkAnswer('1', 'Correct.html', 
'Incorrect.html')" value="Submit" />

表单JavaScript函数checkAnswer不加载页面

1 个答案: