php和jQuery联系表单中的无限循环错误

时间:2010-08-24 16:18:55

标签: php jquery forms

Arrg。

我无法发现此联系表单中的无限循环。表单提交后,“谢谢”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._%-]+@[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-\.]+@([\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 } ?>

2 个答案:

答案 0 :(得分:1)

看起来你正在尝试在拥有现有元素(div)的同时添加元素(<p class="thanks")。你能缩小哪一个?您还有$("#thanks").fadeOut,但似乎没有id thanks的任何元素。

我建议更仔细地查看代码。我没有看到无限循环,但如果由于某种原因重复触发该功能,则会出现相同的症状。

答案 1 :(得分:1)

我对您的代码进行了一些更改,并让它在我的本地计算机上工作,看看这个是否适合您

 <?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._%-]+@[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-\.]+@([\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>