Question

由于我的编码体验很糟糕，我很擅长。我正在尝试验证收音机和表单验证要求的复选框。我需要至少1个复选框和1个收音机必须检查，如果没有弹出警报和状态请选择至少1个复选框和1个收音机，表格必须不提交，直到它被验证..

这是我在下面做的submut finction，而不是我有3但是除非需要，否则我不会发布整个html。

function doSubmit() /

{
if (validateText()==false)
{
alert("Required data missing in Step 1");
}

if (validateRadio()==false)
{
alert("Required data missing in Step 2");
}

if(validateTops()==false)
{
alert("Required data missing in Step 3");
return;
}

我的抱歉尝试留下了剩下的代码。因为我不想发布整个html文件。

function validateRadio()
{
var chks = document.getElementsByName('sizes');
var hasChecked = false;
for (var i = 0; i < chks.length; i++)
{
if (chks[i].checked)
{
hasChecked = true;
break;
}
}

if (hasChecked == false)
{
alert("Please select at a Pizza Size.");
return false;
}

return true;
}

function validateTops()
{
var chks = document.getElementsByName('toppings');
var hasChecked = false;
for (var i = 0; i < chks.length; i++)
{
if (chks[i].checked)
{
hasChecked = true;
break;
}
}

if (hasChecked == false)
{
alert("Please select at a Pizza Size.");
return false;
}

return true;
}

</ script>

</ head> 
<body>
<form Name ="PizzaForm">
<h1> The JavaScrpt Pizza Parlor</h>
<p>
<h4> Step 1: Enter your name, address, phone number, and email:</h4>
<font face="Courier New">
Name: &nbsp;&nbsp;&nbsp;<Input name="customer" size="50" type="text"><br>
Address:&nbsp;<Input name="address" size="50" type="text"><br>
City: &nbsp;&nbsp;&nbsp;<Input name="city" size="15"type="text">
State:<Input name="state" size="2"type="text"><br>
Zip:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<Input name="zip" size="5"type="text"> <br>
Phone: &nbsp;&nbsp;<Input name="phone" size="50"type="text"><br>
Email: &nbsp;&nbsp;<Input name="email" size="31"type="text"><br>
</ font>
</ p>
<p>
<h4> Step 2: Select the size of pizza you want:</h4>
<font face="Courier New">
<input name="sizes" type="radio" value="Small">Small
<input name="sizes" type="radio" value="Medium">Medium
<input name="sizes" type="radio" value="Large">Large
<input name="sizes" type="radio" value="Jumbo">Jumbo<br>    </ font>
</ p>
<p>
<h4> Step 3: Select the pizza toppings you want:</h4>
<font face="Courier New">
<input name="toppings" type="checkbox" value="Pepperoni">Pepperoni
<input name="toppings" type="checkbox" value="Canadian Bacon">Canadian Bacon
<input name="toppings" type="checkbox" value="Sausage">Sausage<br>
<input name="toppings" type="checkbox" value="Mushrooms">Mushrooms
<input name="toppings" type="checkbox" value="Pineapple">Pineapple
<input name="toppings" type="checkbox" value="Black Olives">Black Olives<br>
<input name="toppings" type="checkbox" value="Green Peppers">Green Peppers
<input name="toppings" type="checkbox" value="Extra Cheese">Extra Cheese
<input name="toppings" type="checkbox" value="Plain">Plain    </ font>
</ p>
<input type="button" value="Submit Order" onClick="doSubmit()">
<input type="button" value="Clear Entries" onClick="doClear()">
</ form>
</ body>
</ html>

请注意，我正在寻找一个将在提交时验证表单的数组，如果它失败了，则会使用alet并停止提交。最后，所有收音机的名称都是sizezs，所有复选框的名称都是toppings。

提前致谢

Answer 1

您可以添加＆＃34; required＆＃34;属性到收音机和复选框输入。

<input name="sizes" type="radio" required="required">

通过java脚本进行表单验证如果未经过验证则带有警报

1 个答案: