JavaScript表单验证
JavaScript Form Validation XHTML
我有问题的脚本是一个表单验证。我被难住了。我已经知道问题出在这段代码上,这段代码可以正常工作,但在这段代码之后的任何代码都不能正常工作。如果我删除这个块脚本工作。我试着添加更多的if语句来测试null的不同输入,但它们也不起作用。
var atPos=email.indexOf("@");
var dotPos=email.lastIndexOf(".");
if (atPos<1 || dotPos<atPos+2 || dotPos+2>=x.length)
{
alert("Please enter a valid email");
return false;
}
整个脚本:
<script type="text/javascript">
//<![CDATA[
function validateForm()
{
//Validate First Name
var fName=document.forms["orderForm"]["firstname"].value;
if (fName==null || fName=="")
{
alert("First name must be filled out");
return false;
}
//Validate Last Name
var lName=document.forms["orderForm"]["lastname"].value;
if (lName==null || lName=="")
{
alert("Last name must be filled out");
return false;
}
//Validate Email
var email=document.forms["orderForm"]["email"].value;
if (email==null || email=="")
{
alert("Email must be filled out");
return false;
}
var atPos=email.indexOf("@");
var dotPos=email.lastIndexOf(".");
if (atPos<1 || dotPos<atPos+2 || dotPos+2>=x.length)
{
alert("Please enter a valid email");
return false;
}
//Validate Phone Number
var phone=document.forms["orderForm"]["phoneNumber"].value;
if (phone==null || phone=="")
{
alert("Phone Number must be filled out");
return false;
}
}
//]]>
</script>
和形式:
<form action="index.html" id="orderForm" onsubmit="return validateForm()">
<table>
<tr>
<th>Item</th>
<th>Product Code</th>
<th>Diameter</th>
<th>Lengh</th>
<th>Colour</th>
<th>Unit Price</th>
<th>Quantity</th>
<th>Sub Total</th>
</tr>
<tr>
<td>Bolt</td>
<td>B113</td>
<td>9</td>
<td>50</td>
<td>Black</td>
<td>2.15</td>
<td><input type="text" name="quantityBolt" id="quantityBolt" /></td>
<td>#total</td>
</tr>
<tr>
<td>Nut</td>
<td>B234</td>
<td>5</td>
<td>N/A</td>
<td>Silver</td>
<td>0.45</td>
<td><input type="text" name="quantityNut" id="quantityNut" /></td>
<td>#total</td>
</tr>
<tr>
<td>Washer</td>
<td>W359</td>
<td>8</td>
<td>N/A</td>
<td>Silver</td>
<td>0.30</td>
<td><input type="text" name="quantityWasher" id="quantityWasher" /></td>
<td>#total</td>
</tr>
</table>
First name: <input type="text" name="firstname" /><br />
Last name: <input type="text" name="lastname" /><br />
Email: <input type="text" name="email" /><br />
Phone Number: <input type="text" name="phoneNumber" /><br />
Street Number: <input type="text" name="streetNumber" /><br />
Address: <input type="text" name="address" /><br />
State: <select name="state" >
<option value="nsw">NSW</option>
<option value="qld">QLD</option>
<option value="vic">VIC</option>
<option value="act">ACT</option>
<option value="nt">NT</option>
<option value="tas">TAS</option>
<option value="sa">SA</option>
<option value="wa">WA</option>
</select><br />
Postcode: <input type="text" name="postcode" /><br />
Credit Card Number: <input type="text" name="creditNumber" /><br />
Credit Card Expiry: <input type="text" name="creditDate" /><br />
CSV Number: <input type="text" name="creditCSV" /><br /><br />
<br />
<input type="submit" value="submit" />
</form>
错误在这里:
if (atPos<1 || dotPos<atPos+2 || dotPos+2>=x.length)
错误控制台显示"x未定义"
和Javascript引擎倾向于放弃一个错误,所以它不会做任何其他的
相关文章:
- JAVASCRIPT验证表单中的日期
- 如何在使用ajax提交的codeigniter中使用form_validation验证表单数据
- 如何使用jQuery正确验证表单
- Javascript不会验证表单
- 如何使用javascript验证表单中的数据,然后调用php页面
- 包括来自另一个页面的Boostrap模态;t验证表单
- Javascript验证表单不重定向页面
- 在提交之前验证表单,jQuery发布到javaScript,然后提交到确认页面
- 引导复选框-x 选中时未正确更新 DOM - 如何验证表单
- Jquery 验证表单
- 验证表单中的 jQuery-UI 微调器
- 在 Jquery 中验证表单的输入字段
- 如何验证表单控制数据大小不超过2.5 mb
- 在表单进入Angular中的ng-submit之前验证表单
- Javascript表单验证:表单在错误返回时提交:
- 使用Angular.js验证表单输入的原始状态
- 正在复制验证表单
- 如何在转盘中逐步(3步)验证表单
- 使用javascript验证表单值
- 验证表单按id输入val