php和jQuery联系表格中的无尽循环错误

问题描述：

我无法发现此联系表单中的无限循环。表单提交后，“谢谢”div无限制地打印出来。我错过了什么？是错误的PHP或也是jQuery？（在工作文件中，JS通过<script type="text/javascript" src="contact.js"></script>包括）

感谢

<?php 
if(isset($_POST['submitted'])) { 
if(trim($_POST['checking']) !== '') { 
$captchaError = true; 
} else { 

if(trim($_POST['email']) === '') { 
$emailError = 'Please enter a valid email address'; 
$hasError = true; 
} else if (!eregi("^[A-Z0-9._%-][email protected][A-Z0-9._%-]+\.[A-Z]{2,4}$", trim($_POST['email']))) { 
$emailError = 'That\'s not a valid email address'; 
$hasError = true; 
} else { 
$email = trim($_POST['email']); 
} 
} 

if(!isset($hasError)) { 

$emailTo = 'to email'; 
$subject = 'site email'; 
$body = "$email"; 
$headers = 'From: webmail'; 
mail($emailTo, $subject, $body, $headers); 
$emailSent = true; 
} 
} ?> 


<script type="text/javascript"> 

$(document).ready(function() { 
    $('form#contactForm').submit(function() { 
     $('form#contactForm .error').remove(); 
     var hasError = false; 
     $('.requiredField').each(function() { 
      if($(this).hasClass('email')) { 
       var emailReg = /^([\w-\.][email protected]([\w-]+\.)+[\w-]{2,4})?$/; 
       if(!emailReg.test(jQuery.trim($(this).val()))) { 
        var labelText = $(this).prev('label').text(); 
        $(this).parent().append('<span class="error">&nbsp;&nbsp;<i>invalid email</i></span>'); 

        hasError = true; 
       } 
      } 
     }); 
     if(!hasError) { 
      $('#thanks').fadeOut('normal', function() { 
$(this).parent().append('<img src="../loading-small.gif" alt="Loading&hellip;" height="31" width="31" />'); 

      }); 
      var formInput = $(this).serialize(); 
      $.post($(this).attr('action'),formInput, function(data){ 
       $('form#contactForm').slideUp("fast", function() {     
        $(this).before('<p class="thanks">&nbsp;<strong>Thanks!</strong>'); 
        $(".thanks").delay(3000).fadeOut(); 
       }); 
      }); 
     } 

     return false; 

    }); 
}); 

</script> 


<?php if(isset($emailSent) && $emailSent == true) { ?> 

<div class="thanks"></div> 

<?php } else { ?> 

<form action="http://mysite.com" id="contactForm" method="post"> 

Sign up for email notification <input type="text" name="email" size="30" id="email" value="<?php if(isset($_POST['email'])) echo $_POST['email'];?>" class="requiredField email" /> 

<?php if($emailError != '') { ?><span class="error"><?=$emailError;?></span><?php } ?> 

<input type="hidden" name="submitted" id="submitted" value="true" /> 
<button type="submit">Send</form> 

<?php } ?>

你不信到代码缩进在PHP？ – Tomalak 2010-08-24 16:33:34

这一切都在一个文件中？ – Stian 2010-08-24 16:33:35

还没有学过代码缩进:)想想我需要的。而JS通常包含在URL中（上面编辑的细节） – markratledge 2010-08-24 16:52:51

答

我做了一些改变你的代码，并得到它我的本地机器上工作，看看这一个适合你

<?php 
if(isset($_POST['submitted'])) { 
    if(trim($_POST['checking']) !== '') { 
     $captchaError = true; 
    }else{ 
     if(trim($_POST['email']) === '') { 
      $emailError = 'Please enter a valid email address'; 
      $hasError = true; 
     } else if (!eregi("^[A-Z0-9._%-][email protected][A-Z0-9._%-]+\.[A-Z]{2,4}$", trim($_POST['email']))) { 
      $emailError = 'That\'s not a valid email address'; 
      $hasError = true; 
     } else { 
      $email = trim($_POST['email']); 
     } 
    } 

    if(!isset($hasError)) { 
     $emailTo = 'to email'; 
     $subject = 'site email'; 
     $body = "$email"; 
     $headers = 'From: webmail'; 
     mail($emailTo, $subject, $body, $headers); 
     $emailSent = true; 
    } 
} 
?> 
<html> 
    <head> 
     <title></title> 
     <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> 
     <script type="text/javascript" src="js/jquery-ui.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('form#contactForm').submit(function() { 
       $('.error').remove(); //remove the existing error messages before we submit 
       var hasError = false; 
       //lets go through all the required feilds 
       $('.requiredField').each(function() { 
        //check to see if we are processing email 
        if($(this).hasClass('email')) { 
         var emailReg = /^([\w-\.][email protected]([\w-]+\.)+[\w-]{2,4})?$/; 
         if(!emailReg.test(jQuery.trim($(this).val()))) { 
          // var labelText = $(this).prev('label').text(); //this line seem useless 
          $(this).parent().append('<span class="error">&nbsp;&nbsp;<i>invalid email</i></span>'); // supply eror message 
          hasError = true; 
         } 
        } 
       }); 
       if(!hasError) { 
        $('#thanks').fadeOut('normal', function() { 
         $(this).parent().append('<img src="../loading-small.gif" alt="Loading&hellip;" height="31" width="31" />'); 
        }); 
        var formInput = $(this).serialize(); 
        $.post($(this).attr('action'),formInput, function(data){ 
         $('form#contactForm').slideUp("fast", function() {     
          $(this).before('<p class="thanks">&nbsp;<strong>Thanks!</strong>'); 
          $(".thanks").delay(3000).fadeOut(); 
         }); 
        }); 
       } 
       return false; 
      }); 
     }); 

    </script> 
</head> 
<body> 



<?php if(isset($emailSent) && $emailSent == true) { ?> 

<div class="thanks"></div> 

<?php } else { ?> 

<form action="<?php echo $_SERVER['PHP_SELF']; ?>" id="contactForm" method="post"> 

Sign up for email notification <input type="text" name="email" size="30" id="email" value="<?php if(isset($_POST['email'])) echo $_POST['email'];?>" class="requiredField email" /> 

<?php if($emailError != '') { ?><span class="error"><?=$emailError;?></span><?php } ?> 

<input type="hidden" name="submitted" id="submitted" value="true" /> 
<button type="submit">Send</form> 

<?php } ?> 
    </body> 
</html>

谢谢！现在起作用了。代码注释很好理解。将比较代码，看看我做错了什么.... – markratledge 2010-08-24 18:00:51

高兴我可以帮助.....代码评论主要是为了我的理智 – mcgrailm 2010-08-24 18:19:12

答

它看起来像你想同时具有现有元素（DIV）同时添加元素（<p class="thanks"）。你能缩小哪一个？你也有$("#thanks").fadeOut，但似乎没有任何元素，id的thanks。

我建议仔细阅读代码。我没有看到一个无限循环，但如果出于某种原因反复触发该功能，则会出现相同的症状。

php和jQuery联系表格中的无尽循环错误

相关推荐