表单中的单选按钮不会转移到另一个网页答案

【问题标题】：Radio buttons in form do not transfer to another web page表单中的单选按钮不会转移到另一个网页
【发布时间】：2018-02-26 11:07:14
【问题描述】：

我看不出为什么我的代码在处理我的单选按钮时没有将我带到指定的网页：

<form name="login" onsubmit="return validateForm()"  method="post">
.
.
<input type="radio" name="ans1" id="yes">Yes<br>
<input type="radio" name="ans2" id="no">No<br>
<input type="submit" value="Login" onclick= "where_to_go();">
</form>

where_to_go() 的脚本：

function where_to_go(){
    if (document.login.getElementById('yes').checked) {
        // Yes is chosen
        document.location.href = "Admin_index.html";

    }   else if (document.login.getElementById('no').checked) {
        // No is chosen
        document.location.href ="Log-In_Greet.php";
    }
}

谁能告诉我哪里出错了？

【问题讨论】：

首先，您希望为单选按钮使用相同的name 属性，这样用户就无法选择多个单选按钮。其次，对于脚本，尝试使用document.getElementById('yes').checked，当你有一个id 时，不需要更多的选择器，因为应该只有一个元素带有id。
你能把它设置成一个 sn-p 并向我们展示你的 validateForm() 函数

标签： javascript forms button radio

【解决方案1】：

你有两个问题。

如果您查看了浏览器的开发者工具控制台（并启用了日志保存，这样当您导航到新页面时它不会被擦除），就会显示第一个。

getElementById 是 document 对象的属性，并且仅是 document 对象。它不是document.logic 的属性，因此尝试调用document.login.getElementById 将引发异常。

第二：提交表单时你正在运行你的JS。

JS 运行，告诉浏览器导航到两个页面之一（或者如果上述问题不存在），然后表单提交继续并告诉浏览器导航到表单的action URL（你没有指定所以是“当前 URL”）。这会覆盖 JS 中设置的 URL。

快速而肮脏的解决方案是从onclick函数中调用return false，从而取消提交按钮的正常行为。

稍微不那么脏的方法是使用type="button"，这样一开始就不会触发表单提交。

稳健的方法是编写服务器端代码，在 POST 请求中测试使用了哪个提交按钮并发出 HTTP 重定向。这将在 JS inevitably fails 时起作用。

最简洁、最简单、最可靠的方法是用简单的链接替换单选按钮。

【讨论】：