使用 AJAX/JSON/PHP 的 jquery 电子邮件表单？答案

【问题标题】：jquery email form using AJAX/JSON/PHP?使用 AJAX/JSON/PHP 的 jquery 电子邮件表单？
【发布时间】：2012-05-23 13:56:10
【问题描述】：

我是表单的新手，但我觉得我缺少一些简单的东西。除了“错误”警报之外，根本没有“成功”。

这是 index.html 文件中的表单代码。

<form id="contact-form" name="contact-form" method="post">
    <div id="formResponse"></div>

    <label for="name">NAME:</label>
    <input type="text" name="name" id="name" /><br/>

    <label for="email">EMAIL:</label>
    <input type="text" name="email" id="email" /><br/>

    <label for="message">MESSAGE:</label>
    <textarea name="message" rows="20" cols="20" id="message"></textarea><br/>

    <input type="submit" name="submit" value="SEND" class="submit" />
</form>

我的 .js 文件中的 Ajax 代码

$('.submit').click(form_registration);

function form_registration () {

    var input_data = $('#contact-form').serialize(); 

$.ajax({    
    type: 'post',
    url: '../contact.php',
    data: input_data,
    dataType: 'json',
    success: function( msg ){
        alert('SUCCESS!');
    },
    error: function(){ 
        alert('ERROR!');
        alert(input_data);
    }
});   

}

contact.php 文件

< ?php 

    if($_POST) {

    $name = trim($_POST['name']);
    $email = trim($_POST['email']);
    $msg = trim($_POST['msg']);

    <!-- //email address settings -->
    $my_address = "MY EMAIL ADDRESS GOES HERE";
    $headers = "From: ".$email;
    $message = "Contact name: $name\nContact Email: $email\nContact Message: $msg";

    $to = $my_address;

    if ( $name == "")
    {
        echo 'Name field is required';
        <!-- $result = "Name field is required"; -->
    }
    else if (!preg_match("/^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,4})$/", $email))
    {
        echo 'Enter a valid email address';
        <!-- $result = "Enter a valid email address"; -->
    }
    else if ( strlen($msg) < 10 )
    {
        echo 'Write more than 10 characters';
        <!-- $result = "Write more than 10 characters"; -->
    }

    else
    {
    mail($to, $subject, $message, $headers);
    echo "Your mail has been sent succesfully!";
    }

    if ($javascript_enabled == "true") {
        echo 'javascript enabled';
        die();
    }   
}
?>

这是EXAMPLE。点击底部的联系链接。非常感谢您的帮助！

【问题讨论】：

标签： php json forms jquery email-validation

【解决方案1】：

试试这个代码。我已经对您的代码进行了一些更改，现在它可以正常工作了。

联系方式.html

<head>
    <script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
    <form id="contact" action="contact.php" name="contact" method="post">

<div id="formResponse"></div>

<label for="name">NAME:</label>
<input type="text" name="name" id="name" /><br/>

<label for="email">EMAIL:</label>
<input type="text" name="email" id="email" /><br/>


<label for="sub">SUBJECT</label>
<input type="sub" name="sub" id="subject" /><br/>

<label for="message">MESSAGE:</label>
<textarea name="message" rows="20" cols="20" id="message"></textarea><br/>

<input type="submit" name="submit" value="SEND" class="submit" />
</form>
</body>

联系方式.php

<?php
 if($_POST) {

    $name = trim($_POST['name']);
    $email = trim($_POST['email']);
    $msg = trim($_POST['message']);
    $subject = trim($_POST['sub']);
    //email address settings
    $my_address = "nitish@kinsh.in";
    $headers = "From: ".$email;
    $message = "Contact name: $name\nContact Email: $email\nContact Message: $msg";
    $to = $my_address;
    if ( $name == "")
    {
        echo 'Name field is required';
        $result = "Name field is required"; 
    }
    else if (!preg_match("/^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,4})$/", $email))
    {
        echo 'Enter a valid email address';
        $result = "Enter a valid email address"; 
    }
     else if( strlen($subject) == "")
    {
        echo 'Please Write Subject';
        $result = "Please Write Subject"; 
        }
        else if ( strlen($msg) < 10 )
    {
        echo 'Write more than 10 characters';
        $result = "Write more than 10 characters"; 
    }
    else
    {
        mail($to, $subject, $message, $headers);
        echo "Your mail has been sent succesfully!";
    }
}
?>

Contact.js

$('.submit').click(form_registration);
function form_registration () {

var input_data = $('contact-form').serialize(); 
            $.ajax({
            type: 'post',
            url: 'contact.php',
            data: input_data,
            dataType: 'json',
            success: function( msg ){
            alert('SUCCESS!');
        },
        error: function(){
            alert('ERROR!');
            alert(input_data);
        }
});  
 return false; 
}

【讨论】：

【解决方案2】：

好的，首先你必须在右括号} 之前添加return false 到form_registration()，以防止form 提交

其次，您的contact.php 没有有效的开头PHP 标签将< ?php 更改为<?php

试一试……

【讨论】：