gpt4 book ai didi

javascript - 使用 JavaScript 验证表单语句上的选择字段不起作用

转载 作者:行者123 更新时间:2023-12-03 02:29:31 26 4
gpt4 key购买 nike

我尝试使用 JavaScript 来验证此表单上的所有字段,但卡在选择字段和文本框验证上。文本字段、单选按钮和复选框验证正在工作,但我似乎无法弄清楚选择和文本框,并且当我运行脚本时没有错误......另外,我需要在不更改 HTML 的情况下执行此操作(不ID 标签)我做错了什么?一如既往地感谢!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Validate me</title>
<script>

console.log(document.forms);

function validateForm(){
var show = document.getElementsByName('show').value
var comments = document.getElementsByName('comments');
for (var i=0;i < document.forms[0].length - 1; i++){
if (document.forms[0][i].type == 'text' && document.forms[0][i].value==''){
alert('Please Enter Your Full Name');
return false;
}
else if (document.forms[0][i].type == 'radio'){
if (document.forms[0].gender[0].checked == false && document.forms[0].gender[1].checked == false){
alert('Please select gender');
return false;
}
}
else if (document.forms[0][i].type == 'checkbox'){
var hobbies = document.getElementsByName('hobbies[]');
if (hobbies[0].checked == false && hobbies[1].checked == false && hobbies[2].checked == false){
alert('Please select hobby');
return false;
}
}

else if (show == 'Choose Below'){
alert('Please Select a Favorite Show');
return false;
}


else if(comments.value == 'Enter Comments'|| comments.value == ''){
alert('Please provide comments');
return false;
}


console.log(document.forms[0][i].type);
}


}

</script>
</head>
<body>
At lease one piece of data has to come in from every input type.
<form action = "form.html" method = "get"><br/>
Name:<input type = "text" name = "fullname" placeholder="Enter Full Name"/><br/>
Gender:<br/>
Male<input type = "radio" name = "gender" value="male"/>Female<input type = "radio" name = "gender" value="female"/><br/>
Hobbies<br/>
Baseball <input type = "checkbox" name = "hobbies[]" value = "baseball" />
Football <input type = "checkbox" name = "hobbies[]" value = "football" />
Hockey <input type = "checkbox" name = "hobbies[]" value = "hockey" /><br/>
Favorite Show <select name = "show">
<option value = "">Choose Below</option>
<option value = "ATHF">Aqua Teen Hunger Force</option>
<option value = "Family Guy">Family Guy</option>
<option value = "Simpsons">Simpsons</option>
</select><br/>
Comments<br/>
<textarea cols = "50" rows = "6" name = "comments">Enter Comments</textarea><br/>
<input type = "button" name = "submit" value = "enter me" onclick="return validateForm();" />
</form>

</body>
</html>

最佳答案

强文本这是验证这一点的更简单的形式

<script>

console.log(document.forms);

function validateForm(){
var showData = document.getElementsByName("show");
var show = showData[0][showData[0].selectedIndex].text;
var comments = document.getElementsByName('comments');
for (var i=0;i < document.forms[0].length - 1; i++){
if (document.forms[0][i].type == 'text' && document.forms[0][i].value==''){
alert('Please Enter Your Full Name');
return false;
}
else if (document.forms[0][i].type == 'radio'){
if (document.forms[0].gender[0].checked == false && document.forms[0].gender[1].checked == false){
alert('Please select gender');
return false;
}
}
else if (document.forms[0][i].type == 'checkbox'){
var hobbies = document.getElementsByName('hobbies[]');
if (hobbies[0].checked == false && hobbies[1].checked == false && hobbies[2].checked == false){
alert('Please select hobby');
return false;
}
}

else if (show == 'Choose Below'){
alert('Please Select a Favorite Show');
return false;
}


else if(comments[0].textContent == 'Enter Comments'|| comments.value == ''){
alert('Please provide comments');
return false;
}


console.log(document.forms[0][i].type);
}


}

</script>

关于javascript - 使用 JavaScript 验证表单语句上的选择字段不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48797666/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com