【发布时间】：2011-11-29 16:05:03
【问题描述】：
我正在建立自己的商业网站，我想在不刷新页面的情况下进行表单验证。我正在关注this video from youtube 以帮助实现这一目标。但是，它在 Chrome 中完美运行，但在 Firefox 中无法运行。谁能看到我做错了什么？谢谢！
这是我的 javascript 来验证我的表单：
<script type="text/javascript" >
$(document).ready(function() {
$('#fname').keyup(function() {
$.post('action/validate_signup.php?key=fname', { fname: form.fname.value },
function(result){
$('#fname-error').html(result).show("slow");
});
});
$('#lname').keyup(function() {
$.post('action/validate_signup.php?key=lname', { lname: form.lname.value },
function(result){
$('#lname-error').html(result).show("slow");
});
});
$('#zipcode').keyup(function() {
$.post('action/validate_signup.php?key=zipcode', { zipcode: form.zipcode.value },
function(result){
$('#zipcode-error').html(result).show("slow");
});
});
$('#city').keyup(function() {
$.post('action/validate_signup.php?key=city', { city: form.city.value },
function(result){
$('#city-error').html(result).show("slow");
});
});
$('#email').keyup(function() {
$.post('action/validate_signup.php?key=email', { email: form.email.value },
function(result){
$('#email-error').html(result).show("slow");
});
});
$('#username').keyup(function() {
$.post('action/validate_signup.php?key=username', { username: form.username.value },
function(result){
$('#username-error').html(result).show("slow");
});
});
$('#password').keyup(function() {
$.post('action/validate_signup.php?key=pass', { pass: form.password.value },
function(result){
$('#password-error').html(result).show("slow");
});
});
$('#password2').keyup(function() {
var pass1 = $('#password').val();
var pass2 = $('#password2').val();
if( pass2.length < 5 ){
$('#password2-error').html("Too short!").show("slow");
}
else if(pass2 != pass1){
$('#password2-error').html("Didn't match!").show("slow");
}else{
$('#password2-error').html("<img src='images/check.jpg' />").show("slow");
}
});
});
</script>
这是我的注册表单的一部分：
<div class="signup-page">
<form id="ContactForm" action="#" name="form">
<h2><img src="images/mail.jpg" alt="Sign up to SittersCaregivers.com" width="23" height="24" >Contact Information</h2>
<div class="hr"></div>
<div class="wrapper">
<div class="error-div" id="fname-error" ></div>
<label>First name:</label>
<input type="text" class="input" name="fname" id="fname" />
</div>
<div class="wrapper">
<div class="error-div" id="lname-error" ></div>
<label>Last name:</label>
<input type="text" class="input" name="lname" id="lname" />
</div>
<div class="wrapper">
<div class="error-div" id="zipcode-error" ></div>
<label>Zip code:</label>
<input type="text" class="input" name="zipcode" id="zipcode" />
</div>
<div class="wrapper">
<div class="error-div" id="city-error" ></div>
<label>City:</label>
<input type="text" class="input" name="city" id="city" >
</div>
<div class="wrapper">
<div class="error-div" id="email-error" ></div>
<label>Email Address:</label>
<input type="text" class="input" name="email" id="email">
</div>
<div class="wrapper">
<div class="error-div" id="username-error" ></div>
<label>Username:</label>
<input type="text" class="input" name="username" id="username" />
</div>
<div class="wrapper">
<div class="error-div" id="password-error" ></div>
<label>Create Password:</label>
<input type="text" class="input" name="password" id="password">
</div>
<div class="wrapper">
<div class="error-div" id="password2-error" ></div>
<label>Confirm Password:</label>
<input type="password" class="input" name="password2" id="password2">
</div>
<div class="hr"></div>
<p>By clicking Continue, you agree to our Terms of Use and Privacy Policy.
You'll also receive account updates and special offers from Sittercity.com
which you can opt-out of at any time. </p>
<div class="wrapper">
<input type="submit" class="submit" value="Continue" name="Submit"id="submit"/>
</div>
</div>
</form>
这是我的一些虚拟验证。这只是一个示例验证。
<?php
if(isset($_GET['key'])){
$key = $_GET['key'];
switch($key){
case 'fname':
if(isset($_POST['fname'])){
$fname = $_POST['fname'];
if(empty($fname)){
echo " *First Name Required";
}elseif(strlen($fname)<3){
echo "*Name too short!";
}else{
echo "<img src='images/check.jpg' />";
}
}
break;
case 'lname':
if(isset($_POST['lname'])){
$lname = $_POST['lname'];
if(empty($lname)){
echo " *Last Name Required";
}elseif(strlen($lname)<3){
echo "*Last name too short!";
}else{
echo "<img src='images/check.jpg' />";
}
}
break;
case 'zipcode':
if(isset($_POST['zipcode'])){
$zip = $_POST['zipcode'];
if(empty($zip)){
echo "*Zipcode required!";
}elseif( (strlen($zip)<5) OR (strlen($zip)>5)){
echo "*Must be 5 digits!";
}elseif(!is_numeric($zip)){
echo "Must be numeric!";
}else{
echo "<img src='images/check.jpg' />";
}
}
break;
case 'city':
if(isset($_POST['city'])){
$city = $_POST['city'];
if(empty($city)){
echo "*City Required";
}elseif(strlen($city)<5){
echo "*Too short!";
}else{
echo "<img src='images/check.jpg' />";
}
}
break;
case 'email':
if(isset($_POST['email'])){
$email = $_POST['email'];
if(empty($email)){
echo "*Email Required";
}elseif(strlen($email)<5){
echo "*Too short!";
}else{
echo "<img src='images/check.jpg' />";
}
}
break;
case 'username':
if(isset($_POST['username'])){
$username = $_POST['username'];
if(empty($username)){
echo "*Username Required";
}elseif(strlen($username)<5){
echo "*Too short!";
}else{
echo "<img src='images/check.jpg' />";
}
}
break;
case 'pass':
if(isset($_POST['pass'])){
$pass = $_POST['pass'];
if(empty($pass)){
echo "*Password Required";
}elseif(strlen($pass)<5){
echo "*Too short!";
}else{
echo "<img src='images/check.jpg' />";
}
}
break;
Default: return false;break;
}
}else{
//do nothing
return false;
}
?>
【问题讨论】：
-
错误控制台出现什么错误？
-
您需要发布一些代码，以便我们知道我们在看什么。您的问题需要更多细节。
-
请贴出相关代码和/或jsFiddle示例，否则你的问题无用。
-
你用的是什么代码？它在错误控制台中显示什么错误？你有预览页面吗？
-
大师您好：请参阅gtwebworx.com/layout/signup.php的虚拟页面
标签： php jquery validation