Question

我有一个page-contact.php（我有自定义表格）

            <form id="contact-form" name="contact-form" method="post" action="">
                <input type="text" name="name" placeholder="name"/>
                <input type="text" name="email" placeholder="email"/>
                <textarea rows="4" cols="50" name="message" 
                placeholder="message"> </textarea>
                <input id="submit" type="submit" name="submit" value="send"/>
            </form>

我有一个我的email_process.php（

<?php

$to        = 'info@domain.com';
$subject   = $_POST['name'];
$email     = $_POST['email'];
$body      = $_POST['message'];
$headers   = 'From: '.$email;
$mailCheck = mail($to, $subject, $body, $headers);

if($mailCheck) echo 1;

?>

我还有一个用于echo我的成功消息和错误消息的js文件。 js形式似乎有效。但是email_process.php无效。对于没有wordpress的手工编码的html，表单动作工作＆＃34; email_process.php＆＃34; 我认为wordpress处理代码不同。有人可以帮我这个吗？

$(document).ready(function(){
    alertAnswer();
});


var check = 1;

function alertAnswer(){
$('#contact-form').submit(function(event){
    event.preventDefault();

    checkFormFill();
    if(check == false) alert("you didn't answer my form");
    else sendMessage();
});
}

function checkFormFill() {
check = 1;
$('#contact-form input[type="text"]').each(function(){
    if($(this).val().length < 3) check = false 
}) 

if($('#contact-form textarea').val().length < 3) check = false 
}

function eraseFormData() {
$('#contact-form input[type="text"]').each(function(){
    $(this).val('');
}) 

$('#contact-form textarea').val(''); 
}

function sendMessage() {
$.post('email_process.php',
    {
        name: $('input[name="name"]').val(),
        email: $('input[name="email"]').val(),
        message: $('textarea[name="message"]').val()
    },
    function(data) {
    if(data == 1) {
        $('#sendMessage').text("Thanks for contacting us. 
        We\'ll get back to you     shortly.");
        $('#sendMessage').css("margin-top","15px"); 
        eraseFormData(); 
    } 
    else $('#sendMessage').text("Sorry, an error occured. 
    Please try again!");
});
}

Answer 1

在wordpress中，有许多灵活的插件可供您创建表单并在没有任何硬编码的情况下提交。但是，如果您想知道如何在wordpress中完成此操作，则需要使用wp_mail( $to, $subject, $body, $headers );。请尝试以下方法。

将此添加到您的functions.php

add_action('wp_ajax_nopriv_send_email', 'send_email');

function send_email() {
  // check the nonce before submit the form 
  $nonce = check_ajax_referer( 'ajax_nonce', 'nonce' );
    if($nonce) {

              $to        = 'info@domain.com';
                 $subject   = $_POST['name'];
               $email     = $_POST['email'];
              $body = $_POST['message'];
           $headers = array('Content-Type: text/html; charset=UTF-8');

              wp_mail( $to, $subject, $body, $headers );
       }

}

创建一个新文件并添加以下代码并将其命名为form.js

(function($) {
    jQuery( "form#contact-form" ).submit(function( event ) {
        name: jQuery('input[name="name"]').val();
        email: jQuery('input[name="email"]').val();
        message: jQuery('textarea[name="message"]').val();
        jQuery.ajax({
            url: ajax_object.url,
            data: nonce:ajax_object.nonce + 'action=send_email&name='+name+'&email='+email+'&message='+message,
            dataType: 'JSON',
            type: 'POST',
            success:function(data){
                jQuery('#sendMessage').text("Thanks for contacting us. We\'ll get back to you     shortly.");
            }
        });
    });
}(jQuery));

然后在funtions.php中包含以下代码以及排队脚本。并确保为form.js文件定义正确的路径。

/* Enqueue Scripts */
add_action('wp_enqueue_scripts', 'custom_enqueue_scripts', 99);
function custom_enqueue_scripts(){

    wp_register_script('custom-form', get_template_directory_uri() . '/js/form.js', 'jquery', '2.6.2');
    wp_enqueue_script('custom-form');
    // need to localize the script and add nonce because of spam submissions
    wp_localize_script('custom-form', 'ajax_object', array('url' => admin_url('admin-ajax.php'), 'nonce' => wp_create_nonce("ajax_form_nonce")));
}

我再次没有在此处包含验证功能。您可以将它们包含在相同的form.js文件中。

wordpress行动表格不起作用

1 个答案: