我有以下代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Registration</title>
<script type="text/javascript" src="lib/jquery/jquery-1.4.2.js"></script>
<script type="text/javascript" src="/dateplugin.js"></script>
<link rel="stylesheet" type="text/css" href="/stylez.css"/>
<script type="text/jscript">
$(document).ready(function(){
//$.dateSelectBoxes('mon','da','yea');
//form validation
var hasError = false;
var emailReg = /^([w-.]+@([w-]+.)+[w-]{2,4})?$/;
var email = $("#em").val();
var fname=$("#fn").val();
var lname=$("#ln").val();
var school=$("#sch").val();
var classes=$("#clas").val();
var grade=$("#yr").val();
var month=$("#mon").val();
var days=$("#da").val();
var years=$("#yea").val();
var pass=$("#pas").val();
var zipcode=$("#zip").val();
$("#submitbutton").click(function(e){
if (fname==''){
$("#fn").after("Please enter your first name ");
hasError=true;
}
if (lname==''){
$("#ln").after("Please enter your last name");
hasError=true;
}
if(school==''){
$("#sch").after("Please enter the name of your institution");
hasError=true;
}
if (classes==''){
$("#clas").after("Please enter current classes you are taking");
hasError=true;
}
if (month=='' || day=='' || year==''){
$("#mon").after("Please enter your birthday");
hasError=true;
}
if (pass==''){
$("#pas").after("Please enter the password");
hasError=true;
}
if (zipcode==''){
$("#zip").after("Please enter your zipcode");
hasError=true;
}
if (grade==''){
$("#yr").after("Please enter the year you are in");
hasError=true;
}
if(email == '') {
$("#em").after("You forgot to enter the email address to send ");
hasError = true;
} else if(!emailReg.test(email)) {
$("#em").after("Enter a valid email address to send to.");
hasError = true;
}
if (hasError == true) {
e.preventDefault();
}
else{
//submit form via ajax
}
});
});
</script>
<style type="text/css">
</style>
</head>
<body class="fancy">
<form action="" method="" accept-charset="utf-8">
<table width="800" border="0" cellpadding="1" cellspacing="0" >
<tr>
<td id="column1">
</td>
<td id="column2">
<div class="Sintext"><h1>Sign Up</h1></div>
<div>
<label>First Name</label>
<input type="text" name="fnam" class="fields" id="fn" />
</div>
<div>
<label>Last Name</label>
<input type="text" name="lnam" class="fields" id="ln"/>
</div>
<div >
<label>School</label>
<input type="text" name="scname" class="fields" id="sch"/>
</div>
<div>
<label>Major</label>
<select id="majo" name="major">
<option value="5">—undeclared—</option>
</select>
</div>
<div>
<label>Current Classes</label>
<input type="text" name="class" id="clas" class="fields"/>
<span>add class field</span>
</div>
<div>
<label>Year</label>
<select id="yr" name="year">
<option value="">—Select the year —</option>
<option value="10">Freshman </option>
<option value="20">Sophomore</option>
<option value="30">junior</option>
<option value="40">senior</option>
<option value="50">Alumni </option>
<option value="60">HighSchool </option>
</select>
</div>
<div >
<label>Campus</label>
<input type="text" name="campus" class="fields" />
</div>
<div >
<label>Email</label>
<input type="text" name="email" id="em" class="fields"/>
</div>
<div >
<label>Password</label>
<input type="text" name="passwd" id="pas" class="fields"/>
</div>
<div >
<label>Sex</label>
<select name="sex" class="sexfield">
<option value="3">Male</option>
<option value="4">Female </option>
</select>
</div>
<div id="bdate">
<label>Birthday</label>
<select id="mon" name="mont">
<option value="0">Month</option>
</select>
<select id="da" name="day">
<option value="1">Day</option>
</select>
<select id="yea" name="year">
<option value="2">Year</option>
</select>
</div>
<div >
<label>Zipcode</label>
<input type="text" name="zipcod" id="zip" class="zipfield"/>
</div>
<div >
<button id="submitbutton" class="sinbutton">Sign Up</button>
</div>
</td>
</tr>
</table>
</form>
</body>
</html>
答案 0 :(得分:1)
嗯,首先:
<div "> <--- Invalid Markup
<label>Password</label>
<input type="text" name="passwd" id="pas" class="fields"/>
</div>
<table width="800" border="0" cellpadding="1" cellspacing="0" /> <--- self closing Table......
您的电子邮件正则表达式无效。
最后: 改变:
$("#sign").click(function(e) {
})
为:
$("#submitbutton").click(function(e) {
});
和
<button type="submit" id="submitbutton" class="sinbutton">Sign Up</button>
到
<button id="submitbutton" class="sinbutton">Sign Up</button>
和
if (hasError == true) {
return false;
}
else {
//submit form via ajax
}
到
if (hasError == true) {
e.preventDefault();
}
else {
//submit form via ajax
}
<强>更新强>
你的正则表达式仍然无效!取消注释正则表达式,以及检查它的代码,暂时取消它。
你宣布:var days=$("#da").val();
但稍后你试图访问不存在的变量“day”。
同样的事情:var years=$("#yea").val();
但访问变量年份:
if (month=='' || day=='' || year==''){
首先:您需要了解如何在Chrome中使用FireBug(Firefox),开发者工具(IE)或检查器,因为此处会显示javascript错误。
第二:您应该学习如何正确格式化问题。我现在必须两次编辑你的问题,清理它。
第三:在发布有关HTML / Javascript / CSS的问题时,您应该使用jsfiddle.net来演示您的代码。看看这个:
答案 1 :(得分:0)
因为您在单击提交的按钮表单时已经形成了提交按钮。像这样更改代码
$("#sign").click(function(e){ e.preventDefault(); . . .