表单发送消息两次

Form sends message twice

本文关键字:两次 消息 表单      更新时间:2023-09-26

我正在适应一个自由的形式,它工作得很好,但它发送电子邮件两次,并在两次完成后写消息。我试图用"按钮"类型的一个输入标签替换按钮和输入标签,但它兑现了。此外,问题是,每次点击运行脚本和发送下一个消息,所以如果我点击几次在一个时刻它会发送很多电子邮件。我应该在php或js中禁止这个吗?

<?php if(isset($emailSent) && $emailSent == true) { ?>
                <p class="info">Your email was sent</p>
            <?php } else { ?>
                <div class="desc">
                    <h2>Contact Us</h2>
                </div>
                <div id="contact-form">
                    <?php if(isset($hasError) || isset($captchaError) ) { ?>
                        <p class="alert">Error submitting the form</p>
                    <?php } ?>
                    <form id="contact-us" action="contact.php" method="post">
                        <div class="formblock">
                            <label class="screen-reader-text">Name</label>
                            <input type="text" name="contactName" id="contactName" value="<?php if(isset($_POST['contactName'])) echo $_POST['contactName'];?>" class="txt requiredField" placeholder="Name:" />
                            <?php if($nameError != '') { ?>
                                <br /><span class="error"><?php echo $nameError;?></span> 
                            <?php } ?>
                        </div>
                        <div class="formblock">
                            <label class="screen-reader-text">Email</label>
                            <input type="email" name="email" id="email" value="<?php if(isset($_POST['email']))  echo $_POST['email'];?>" class="txt requiredField email" placeholder="Email:" />
                            <?php if($emailError != '') { ?>
                                <br /><span class="error"><?php echo $emailError;?></span>
                            <?php } ?>
                        </div>
                        <div class="formblock">
                            <label class="screen-reader-text">Message</label>
                             <textarea name="comments" id="commentsText" class="txtarea requiredField" placeholder="Message:"><?php if(isset($_POST['comments'])) { if(function_exists('stripslashes')) { echo stripslashes($_POST['comments']); } else { echo $_POST['comments']; } } ?></textarea>
                            <?php if($commentError != '') { ?>
                                <br /><span class="error"><?php echo $commentError;?></span> 
                            <?php } ?>
                        </div>
                        <button name="submit" type="submit" class="subbutton">Send us Mail!</button>
                            <input type="hidden" name="submitted" id="submitted" value="true" />
                    </form>         
                </div>
            <?php } ?>
        </div>
    </div><!-- End #contact -->
<script type="text/javascript">
    <!--//--><![CDATA[//><!--
    $(document).ready(function() {
        $('form#contact-us').submit(function() {
            $('form#contact-us .error').remove();
            var hasError = false;
            $('.requiredField').each(function() {
                if($.trim($(this).val()) == '') {
                    var labelText = $(this).prev('label').text();
                    $(this).parent().append('<span class="error">Your forgot to enter your '+labelText+'.</span>');
                    $(this).addClass('inputError');
                    hasError = true;
                } else if($(this).hasClass('email')) {
                    var emailReg = /^(['w-'.]+@(['w-]+'.)+['w-]{2,4})?$/;
                    if(!emailReg.test($.trim($(this).val()))) {
                        var labelText = $(this).prev('label').text();
                        $(this).parent().append('<span class="error">Sorry! You''ve entered an invalid '+labelText+'.</span>');
                        $(this).addClass('inputError');
                        hasError = true;
                    }
                }
            });
            if(!hasError) {
                var formInput = $(this).serialize();
                $.post($(this).attr('action'),formInput, function(data){
                    $('form#contact-us').slideUp("fast", function() {                  
                        $(this).before('<p class="tick"><strong>Thanks!</strong> Your email has been delivered. Huzzah!</p>');
                    });
                });
            }
            return false;   
        });
    });
    //-->!]]>
</script>
<?php 
error_reporting(E_ALL ^ E_NOTICE); // hide all basic notices from PHP
//If the form is submitted
if(isset($_POST['submitted'])) {
    // require a name from user
    if(trim($_POST['contactName']) === '') {
        $nameError =  'Forgot your name!'; 
        $hasError = true;
    } else {
        $name = trim($_POST['contactName']);
    }
    // need valid email
    if(trim($_POST['email']) === '')  {
        $emailError = 'Forgot to enter in your e-mail address.';
        $hasError = true;
    } else if (!preg_match("/^[[:alnum:]][a-z0-9_.-]*@[a-z0-9.-]+'.[a-z]{2,4}$/i", trim($_POST['email']))) {
        $emailError = 'You entered an invalid email address.';
        $hasError = true;
    } else {
        $email = trim($_POST['email']);
    }
    // we need at least some content
    if(trim($_POST['comments']) === '') {
        $commentError = 'You forgot to enter a message!';
        $hasError = true;
    } else {
        if(function_exists('stripslashes')) {
            $comments = stripslashes(trim($_POST['comments']));
        } else {
            $comments = trim($_POST['comments']);
        }
    }
    // upon no failure errors let's email now!
    if(!isset($hasError)) {
        $emailTo = 'example@example.com';
        $subject = 'Submitted message from '.$name;
        $sendCopy = trim($_POST['sendCopy']);
        $body = "Name: $name 'n'nEmail: $email 'n'nComments: $comments";
        $headers = 'From: ' .' <'.$emailTo.'>' . "'r'n" . 'Reply-To: ' . $email;
        mail($emailTo, $subject, $body, $headers);
        mail($email, $subject, $body, $headers);
        // set our boolean completion value to TRUE
        $emailSent = true;
    }
}
?>

提交处理程序函数接收一个名为event的参数。当您检测到一个验证错误时,您需要调用event.preventDefault()以使表单不提交。

$(document).ready(function() {
    $('form#contact-us').submit(function(event) {
        // you detect a validation error...
        hasError = true;
        // more stuff on submit...
        // at the end of the function
        if (hasError) {
            event.preventDefault();
        }
    });