Question

我正在尝试构建自己的WordPress主题，它似乎可以工作，但我的电子邮件表单有问题。在我适应WordPress之前使用它时代码有效，但现在却没有。

$(function() {
$("#contactForm input,#contactForm textarea").jqBootstrapValidation({
    preventSubmit: true,
    submitError: function($form, event, errors) {
        // additional error messages or events
    },
    submitSuccess: function($form, event) {
        // Prevent spam click and default submit behaviour
        $("#btnSubmit").attr("disabled", true);
        event.preventDefault();
        console.log ('1');

        // get values from FORM
        var name = $("input#name").val();
        var email = $("input#email").val();
        var phone = $("input#phone").val();
        var message = $("textarea#message").val();
        var firstName = name; // For Success/Failure Message

        // Check for white space in name for Success/Fail message
        if (firstName.indexOf(' ') >= 0) {
            firstName = name.split(' ').slice(0, -1).join(' ');
            console.log ('2');
        }

        $.ajax({
            url: "./mail/contact_me.php",
            type: "POST",
            data: {
                name: name,
                phone: phone,
                email: email,
                message: message
            },
            cache: false,
            success: function() {
                // Enable button & show success message
                console.log ('3');

                $("#btnSubmit").attr("disabled", false);
                $('#success').html("<div class='alert alert-success'>");
                $('#success > .alert-success').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;")
                    .append("</button>");
                $('#success > .alert-success')
                    .append("<strong>Your message has been sent. </strong>");
                $('#success > .alert-success')
                    .append('</div>');

JavaScript文件位于此路线中：domain/wp-content/themes/federo/js/contact_me.js

PHP文件在这里：domain/wp-content/themes/federo/mail/contact_me.php

Answer 1

尽管@ ruslan-nigmatulin答案可行，但最好传递该URL（以及您需要的任何其他内容）wp_localize_script功能，如下所示：

wp_localize_script( 'ajax-script', 'ajax_object', array( 'ajax_url' => get_template_directory_uri() . '/mail/contact_me.php');

在这个例子中：
- ajax-script是您与wp_enqueue_script一起使用的句柄 - ajax_object是脚本可用的对象的名称
- 第3个参数是您要传递的一系列值

然后在JS中获取ajax_url，您只需执行ajax_object.ajax_url。在这种情况下（假设federo是您当前的主题），ajax_object.ajax_url将为http://domain/wp-content/themes/federo/mail/contact_me.php

Answer 2

尝试更改

url: "./mail/contact_me.php",

进入绝对路径

url: "http://domain/wp-content/themes/federo/mail/contact_me.php",

未找到Ajax调用php，404错误

2 个答案: