3

我的联系表格有这个问题。当我提交表格时，我的邮箱中收到了 2 封相同的电子邮件。

我使用 JS 检查表单是否有错误，然后使用简单的 PHP mail() 函数发送电子邮件。

这是PHP代码：

<?php

$from = Trim(stripslashes($_POST['email']));
$to = "myemail@gmail.com";

$subject = "Contact Form";
$name = Trim(stripslashes($_POST['name']));
$email = Trim(stripslashes($_POST['email']));
$number = Trim(stripslashes($_POST['number']));
$message = Trim(stripslashes($_POST['message']));

    $body = "";
    $body .= "Name: ";
    $body .= $name;
    $body .= "\n\n";
    $body .= "E-mail: ";
    $body .= $email;
    $body .= "\n\n";
    $body .= "Telephone Number: ";
    $body .= $number;
    $body .= "\n\n";
    $body .= "Message: ";
    $body .= $message;
    $body .= "\n\n";

    $success = mail($to, $subject, $body, "From: <$from>" . "\r\n" . "Reply-to: <$from>" . "\r\n" . "Content-type: text; charset=utf-8");

?>

这是JS：

$(".submit").click(function() {
        var name = $("input[name=name]").val();
        var email = $("input[name=email]").val();
        var number = $("input[name=number]").val();
        var message = $("textarea[name=message]").val();

        if (defaults['name'] == name || name == "") {
            $(".error").text("Please enter your name!");
            return false;

        } else if (defaults['email'] == email || email == "") {
            $(".error").text("Please enter your email!");
            return false;

        } else if (defaults['number'] == number || number == "") {
            $(".error").text("Please enter your number!");
            return false;

        } else if (defaults['message'] == message || message == "") {
            $(".error").text("Plese enter your message!");
            return false;
        }

        var dataString = 'name=' + name + '&email=' + email + '&number=' + number + '&message=' + message;
        $(".error").text("Please wait...").hide().fadeIn("fast");

        $.ajax({
            type: "POST",
            url: "contact.php",
            data: dataString,
            success: function() {
                $('#form form').html("");
                $('#form form').append("<div id='success'>Your message has been sent! Thank you</div>");
            }
        });

        return false;
    });

这是 HTML 表单：

<form id="contact" method="post" action="#">

<label for="name">Name:</label>
<input type="text" name="name" required tabindex="1">

<label for="email">Email adress:</label>
<input type="text" name="email" required tabindex="2">

<label for="number">Tel. number:</label>
<input type="text" name="number" tabindex="3">

<label for="message">Your message:</label>
<textarea name="message" rows="10" cols="70" required tabindex="4"></textarea>

<input type="checkbox" id="terms" name="terms" value="terms">I agree to the <a href="#">terms</a>

<input type="submit" name="submit" class="submit more-info" tabindex="5" value="Send">

<span class="error"></span>

</form>

我一直在为我的所有联系表格使用相同的代码，它工作正常。可能是托管/服务器相关问题吗？

4

3 回答 3

2

$(".submit").click(function(e) { ... })首次发布到您的服务器。

因为这是一个<submit>按钮，所以表单仍然会提交。表单第二次发布到您的服务器。

e.preventDefault()解决方案是在函数内部的底部添加一个$(".submit").click...

$(".submit").click(function(e) {
    //                      ^ add this e
    var name = ...;

    $.ajax({
        ...
    });
    e.preventDefault();
    return false;
});
于 2013-10-08T17:42:28.463 回答
2

替换您的点击事件

$(".submit").click(function() {

和

$('.submit').unbind('click').click(function() {

代码。

我可以假设您的点击事件绑定两次可能是由于代码中的很多混乱

在点击事件函数的末尾也使用这一行

$('.submit').unbind('click').click(function() {

    // your stuff

    event.stopImmediatePropagation(); // as long as not bubbling up the DOM is ok?
});

供参考看看链接：https ://forum.jquery.com/topic/jquery-executes-twice-after-ajax

于 2013-10-08T19:52:26.093 回答
0

尝试删除 jQuery 动画：

$(".error").text("Please wait...").hide().fadeIn("fast");

它们有时会引起问题。

于 2013-10-08T17:42:39.567 回答