在外部Javascript函数中无法重定向到URL

Question

我目前正在尝试编写一个相对简单的网站，但是我的HTML和Javascript技能非常基础。 基本上，我想做的是创建一个页面，在其中向用户询问一个问题，并通过将其键入表单来回答该问题。 使用外部Javascript函数，会将用户答案与正确的答案进行比较，如果答案相同，则应该将用户重定向到其他站点。 这是我的HTML文档中的表格：

<FORM NAME="myform" ACTION="" METHOD="GET"> Answer:
    <INPUT TYPE="text" NAME="inputbox" VALUE="">
    <button onClick="checkAnswerExact(this.form)"> Submit </button> 
</FORM>

我的Javascript函数如下所示：

function checkAnswerExact(form){ 
  //GET ANSWER
  var x = form.inputbox.value;
  //CONVERT ANSWER TO STRING
  var TestAnsw =x.toString();
  //DEFINE RIGHT ANSWER
  var RightAnsw = "rightanswer";
  //CHECK IF THEY ARE THE SAME
  if (TestAnsw.toLowerCase() == RightAnsw.toLowerCase() ){ 
    alert("The answer is right.");
    window.location.href = 'https://www.reddit.com/';
  } //WHAT TO DO IF ANSWER'S RIGHT
  else {
    alert("The answer is wrong.");
  } //WHAT TO DO IF ANSWER'S WRONG  
}

作为将其重定向到的示例站点，我选择了reddit。 警报可以正常工作，因此可以比较字符串。 我已经搜寻了一段时间，并浏览了很多论坛，但似乎没有任何用处。 我已经在if-else语句内部和外部尝试了document.location=url和window.replace(url) ，但似乎没有任何作用，窗口仅重新加载。 起作用的是window.open(url) ，但我不希望它在新选项卡中打开。 如果相关的话，我正在使用Chrome作为浏览器。

我希望得到一些帮助，我已经研究了几个小时，而且我很确定这可能是我犯了一个看不见的错误。
干杯!

Answer 1

这应该可以解决问题。

<INPUT TYPE="text" id="inputbox" NAME="inputbox" VALUE="">
<button id="myButton">Submit</button>

<script type="text/javascript">
   document.getElementById("myButton").onclick = function () {
       var TestAnsw =document.getElementById("inputbox").value;
       //DEFINE RIGHT ANSWER
       var RightAnsw = "rightanswer";
       //CHECK IF THEY ARE THE SAME
       if (TestAnsw.toLowerCase() == RightAnsw.toLowerCase() )
          {alert("The answer is right.");
          location.href = "https://www.reddit.com/"} 
      //WHAT TO DO IF ANSWER'S RIGHT
      else
      {alert("The answer is wrong.");} //WHAT TO DO IF ANSWER'S WRONG

    }
};
</script>

Answer 2

好吧，我只是想出您的代码存在的问题。 使用您的按钮添加on onClick事件返回false。 所以你的代码将成为

<button onClick="checkAnswerExact(this.form); return false;"> Submit </button>

并且也改变

 window.location.href = 'https://www.reddit.com/';

至

 window.location = 'https://www.reddit.com/';

Answer 3

如该问题中所建议，您需要使用“ _self”调用该函数：

window.open("https://www.reddit.com/", "_self");

这表明它必须在同一选项卡中打开，而不必打开新的选项卡。 这是一样的设定target的a元素。

Answer 4

您的按钮是一个提交按钮（如果您未指定类型，则为默认按钮），因此如果您按该按钮（在执行onclick处理程序之后），浏览器将为您的表单发送GET请求。 只需将您的按钮定义更改为

<button type="button" onClick="checkAnswerExact(this.form)"> Submit </button>

它应该工作。