JavaScript 单选按钮不起作用，需要帮助
Posted
技术标签:
【中文标题】JavaScript 单选按钮不起作用，需要帮助【英文标题】：JavaScript Radio Buttons not working and need assistance 【发布时间】：2020-03-30 18:08:16 【问题描述】：function validateStudent()
//retrieve Last Name, First Name, Email values
var lastName = document.getElementById("lastName").value;
var firstName = document.getElementById("firstName").value;
var email = document.getElementById("email").value;
var resident = document.getElementById("resident").value;
//retrieve index value of Advisor
advisorIndex = document.getElementById("advisor").selectedIndex;
//Validate and determine class value
classChecked = false;
for (var i = 0; i < document.frmStudent.class.length; i++)
if (document.frmStudent.class[i].checked == true)
classChecked = true;
vClass = document.frmStudent.class[i].value;
//Determine resident status
if (document.getElementById("resident").checked == true)
alert("KY Resident:Yes.")
resident = "Yes";
else
alert("KY Resident:No.")
resident = "No";
//Validate student data entries
if (lastName == "")
alert("Please enter your last name.");
document.frmOrder.lastName.select();
return false;
else if (firstName == "")
alert("Please enter your first name.");
document.frmOrder.firstName.select();
return false;
else if (email == "")
alert("Please enter a valid email address");
document.frmOrder.email.select();
return false;
else if (classChecked == false)
return false;
else if (advisorIndex == -1)
return false;
else
//determine Advisor name based on advisor index value
vAdvisor = document.frmStudent.advisor.options[advisorIndex].value;
//Prepare and display student entries
studentEntries =
alert(studentEntries);
return false;
fieldset
width: 50%;
margin: 0px 0px 10px 1%;
legend
padding: 2px;
text-indent: 5px;
p
margin-left: 1%;
#contactEntry label
clear: left;
display: block;
float: left;
width: 30%;
margin: 7px 5px;
#contactEntry input
display: block;
float: left;
width: 60%;
margin: 7px 5px;
input[type="submit"],
input[type="reset"]
display: inline;
float: none;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>EKU Student Information</title>
</head>
<body>
<form name="frmStudent" id="frmStudent" action=" " method="post" onsubmit="return validateStudent();">
<fieldset id="contactEntry">
<legend>Contact Information</legend>
<label for="lastName">Last Name:</label>
<input type="text" name="lastName" id="lastName" />
<label for="firstName">First Name:</label>
<input type="text" name="firstName" id="firstName" />
<label for="email">E-Mail:</label>
<input type="text" name="email" id="email" />
</fieldset>
<fieldset id="fieldClass">
<legend>Class Classification</legend>
<input type="radio" name="class" id="freshman" value="Freshman" checked="checked" /> Freshman
<br/>
<input type="radio" name="class" id="sophomore" value="Sophomore" checked="checked" /> Sophomore
<br/>
<input type="radio" name="class" id="junior" value="Junior" checked="checked" /> Junior
<br/>
<input type="radio" name="class" id="senior" value="Senior" checked="checked" /> Senior
</fieldset>
<fieldset id="fieldAdvisor">
<legend>My Advisor</legend>
<select size="5" name="advisor" id="advisor">
<option>Mike Hawksley</option>
<option value="Chang-Yang Lin">CY Lin</option>
<option>Steve Loy</option>
<option>Bob Mahaney</option>
<option>Ted Randles</option>
</select>
</fieldset>
<p> <input type="checkbox" name="resident" id="resident" />
<label for="resident">Kentucky Resident</label>
</p>
<p><input type="submit" value="Submit" onclick="onsubmit" />
<input type="reset" value="Reset" /></p>
</form>
</body>
</html>我的任务是执行以下任务，但我无法让代码正常工作。非常感谢所有帮助。
创建一个确认用户的表单验证函数：
-
在姓氏、名字和电子邮件中输入值。
通过选择 Class 单选按钮之一来指定 Class 值。
从表单选择列表中选择一个顾问。
如果任何验证失败，则显示带有相应消息的警报。如果没有输入文本输入值之一，请选择关联输入的当前值。
使用表单提交偶数处理程序调用表单验证函数。 在表单验证所有表单输入后，显示警报以汇总用户输入。如果选中肯塔基州居民复选框，则显示消息“KY 居民：是”。如果清除了肯塔基州居民复选框，则显示消息“KY 居民：否”。【问题讨论】：
目前尚不清楚您遇到了什么问题。你能解释一下你看到了什么错误信息或发生了什么吗？ Stack Overflow 旨在帮助找到特定问题的答案，而不是为您完成任务。查看 SO 指南，看看您是否可以更好地重新表述问题，并可能将代码减少到特定问题区域。 ***.com/help/how-to-ask 首先您需要在resident = "No"; 之后删除错误的开始大括号resident = "No";之后的花括号
@Zak 我在 resident = "No"; 之后修复了卷曲；
【参考方案1】：
通过查看您的代码，我可以看到驻留条件没有关闭。 例如：
alert("KY Resident:Yes.")
resident = "Yes";
else
alert("KY Resident:No.")
resident = "No";
change it to
if (document.getElementById("resident").checked == true)
alert("KY Resident:Yes.")
resident = "Yes";
else
alert("KY Resident:No.")
resident = "No";
为了让您的代码循环通过表单验证器，我建议将 <p><input type="submit" value="Submit" onclick = "onsubmit"/> 替换为 <p><input type="submit" value="Submit" onclick = "validateStudent"/>
对于数组，您可以在 validateStudent 函数的开头创建它，并且在某种情况下您可以推送消息。
function validateStudent()
var output = [];
// change these kind of if statement
if (document.getElementById("resident").checked == true)
alert("KY Resident:Yes.")
resident = "Yes";
// to something like this
if (document.getElementById("resident").checked == true)
output.push("KY Resident:Yes.");
resident = "Yes";
// at the end of the function
alert(output.join('\n'))
【讨论】：
我需要帮助的是弄清楚如何在验证功能验证表单输入后获得总结用户输入的警报。 我建议使用数组，然后将字符串（“消息”）推入其中，然后在警报提示中输出。 这是我老师的建议（我是新手，正在学习）建议，但我不明白该数组放在哪里。到目前为止，我非常感谢您的帮助。警报消息至少现在有效！ 你可以查这个answer 上面的数组在下面的函数之前得到了吗？函数 validateStudent()以上是关于JavaScript 单选按钮不起作用，需要帮助的主要内容，如果未能解决你的问题，请参考以下文章