-1
我正在構建自己的業務網站，並希望在不刷新頁面的情況下進行表單驗證。我正在關注this video from youtube以幫助完成此目標。但是，它在Chrome中完美運行，但不適用於Firefox。任何人都可以看到我做錯了什麼？謝謝！Jquery：驗證表單在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示例，否則您的問題是無用的。 – Sparky