0

我想在提交表单后执行一个 jQuery 脚本。jQuery 脚本它只是一条会淡入淡出的行，隐藏的将显示电子邮件是否已发送或未发送。

PHP 代码位于文件的顶部，我不知道将 PHP 代码保持在顶部是否是问题，但我尝试将 de PHP 移动到 jquery 脚本之上，但它不起作用。

编辑：

现在我的 index.php 中有该代码

        $(document).ready(function) {
            $('form').submit(function) {
                $.ajax({
                    url: "mail.php",
                    type: "POST",
                    data: {
                        name: $('input[name="name"]').val(),
                        email: $('input[name="email"]').val(),
                        msg: $('input[name="msg"]').val()
                    },
                    cache: false,
                    success: function(response) {
                        $('#result').html(response);
                    }
                });
                return false;
            });
        });

在 mail.php 我有其他代码

$name = $_POST['name'];
$mail = $_POST['email'];
$msg = $_POST['msg'];

if(mail('test@test.com', $name, $msg)) {
    echo 'Pass!';
} else {
    echo 'Fail!';
}

当我执行它时，什么也没有发生，并且 URL 显示了我在输入中写入的数据，但出现了任何消息。

4

2 回答 2

1

这是一个使用 AJAX 处理表单的简单示例。请注意 IDs:#emailForm是表单的 ID，并且是您要在其中显示结果#out的某个 HTML 元素（例如 adiv或）的 ID。p函数 email.php 是您的服务器端脚本，用于发送电子邮件并返回结果。

$(document).ready(function() {
    $('#emailForm').submit(function(){
        $.ajax({
        url: "email.php",
        type: 'POST',
        data: {
            name: $('input[name="name"]').val(),
            email: $('input[name="email"]').val(),
            msg: $('input[name="msg"]').val()
        },
        cache: false,
        success: function(responseText){
            $('#out').html(responseText);
        }
        });
        return false;
    });
});

在服务器端，email.php（或任何您想调用的名称）处理数据并发送电子邮件。可以从 $_POST 数组中检索数据。在发送或尝试发送电子邮件后，email.php 可以简单地回显要插入到 id 为“out”的 HTML 元素中的结果。

$name = $_POST['name'];
$email = $_POST['email'];
$msg = $_POST['msg'];
//PUT CODE HERE FOR SENDING EMAIL

if ($success){
    echo "Email sent with success!";
} else {
    echo "Unable to send your email at this time. Please try again later.";
}

输出应出现在 HTML 元素中：

<div id="out">Email sent with success!</div>
于 2013-06-04T12:37:15.473 回答
0

您可以在标签中使用onSubmit属性form

例如 

  <form name="anything" id="anything" onSubmit="functionname();" >

或者另一个选项onClick是Submit按钮

  <input type="submit" onClick="functionname();" value="SUBMIT FORM" />

我个人更喜欢第一种方法

于 2013-06-04T11:11:16.660 回答