php - 为什么我的 Ajax 联系表没有收到电子邮件？

Question

我正在尝试设置联系表格，但由于某种原因它无法正常工作，我不确定为什么。

这是contactform、我的ajaxform.js 和我的functions.php 中的parser_callback 函数。

联系表

<div id="form-response">
</div>
<form class="contact-form" method="post" action="" id="ajaxContactForm">
<div class="upper-form">
<div class="contact-input"><input type="text" id="name" placeholder="Your name" required></div>
<div class="contact-input"><input type="email" id="mail" placeholder="Your mail" required></div>
</div>
<div class="contact-input"><textarea id="message" placeholder="Your message" rows="10" required></textarea></div>
<div class="lower-form">
<div class="contact-input"><span class="status"></span></div>
<div class="contact-input"><input id="submitButton" type="submit" value="Send"></div>
</div>
</form>

ajaxform.js

$(document).ready(function() {  
console.log( "ready!" );
    $( '#ajaxContactForm' ).submit(ajaxSubmit);

function ajaxSubmit(e){

e.preventDefault();
var name = $( "#name" ).val();
var mail = $( "#mail" ).val();
var message = $( "#message" ).val();
var replyText = $( "#form-response" );
var status = $( ".status" );

$( "#submitButton" ).attr("disabled", true);
status.html( 'please wait...' );
console.log(status);
function clearForm() {
    $( "#name" ).val( '' ); 
    $( "#mail" ).val( '' );
    $( "#message" ).val( '' );
}

    $.ajax({ //ajax request
         url: MyAjax.ajaxurl, //wp's own admin-ajax.php that will handle the request
         type: 'POST', //what kind of request: its a post-request, we are sending data to the server
         datatype: 'json', //what datatype received back, explicitly stated json wanted
         data: { //actual data sending
            "action": 'parser_callback', //what action to execute, in this case parser_callback in functions.php
            name: name,
            mail: mail,
            message: message,
            "nonce": MyAjax.nonce //send the nonce for security
         },
         success: function( response ) {
             status.html( response );
             replyText.html ( '<h2>Thanks for contacting me '+ name +'! I will get back to you as soon as possible.</h2>' );
             clearForm();
             $( "#submitButton" ).attr("disabled", false);
         },
         error: function( error ) {
             status.html( response );
             $( "#submitButton" ).attr("disabled", false);
         },
         beforeSubmit : function(arr, $form, options){
            arr.push( { "name" : "nonce", "value" : MyAjax } );
         }
    });
    return false;
    }
    });

parser_callback（在functions.php中）

function parser_callback() {

        wp_send_json_error( 'You suck!' ); // to see if the ajax request to parser is successfully sent.

        if ( ! check_ajax_referer( 'ajax-contact-nonce', 'nonce' ) ) { // to see if nonce checks out
            return wp_send_json_error( 'Invalid nonce' );
        }

    if ( isset($_POST['name']) && isset($_POST['mail']) && isset($_POST['message']) ) { 
        $name = $_POST['name'];
        $mail = $_POST['mail'];
        $message = nl2br($_POST['message']);
        $to = "<[e-mail]>";
        $from = "<$mail>";
        $subject = 'Contactform from mysite.com sent';
        $message = '<b>Name:</b> '.$name.' <br><b>Email:</b> '.$mail.' <p>'.$message.'</p>';
        $headers = "From: $from" . "\r\n" . "Reply-to: $mail" . "\r\n" . "X-Mailer: PHP/" . phpversion();
        $headers .= "MIME-version: 1.0\n";
        $headers .= "Content-Type: text/html; charset=utf-8\n"; //Fixes ÅÄÖ in Sender name and Message


        if( mail($to, '=?UTF-8?B?'.base64_encode($subject).'?=', $message, $headers) ) { //Fixes ÅÄÖ in subject 
            echo "success"; 

        } else { 
            echo "The server failed to send the message. Please try again later."; 
        } 
    } 
    exit();
    }
    add_action( 'wp_ajax_parser', 'parser_callback' );
    add_action( 'wp_ajax_nopriv_parser', 'parser_callback' );

当我测试我的表单时，我没有收到任何错误（我在 functions.php 中添加了错误报告处理），除了“你糟透了！” 网络日志中的 json_error 表示对解析器函数的 ajax 请求未成功，但我不知道为什么。

此外，显示“感谢您联系我..”文本，但没有成功或服务器失败的回声。我也没有使用 chrome 工具的检查和/或控制台获得任何其他信息。

标签： phpajaxwordpresscontact-form