Question

我是网站开发的新手，并且正在开发WordPress网站。尽管与SO上的另一个问题类似，但该问题不使用jQuery.AJAX，而是使用请求类型为“ category”的jQuery.post。尝试使用AJAX时，我遇到某种语法问题。我创建了一个简单的插件来输入名称，将其发送到服务器，然后回显它。以下是php文件my-ajax-test.php：

add_action( 'wp_enqueue_scripts', 'ajax_test_enqueue_scripts' );
function ajax_test_enqueue_scripts() {
    wp_enqueue_script( 'my-script-handler', plugins_url( '/my-ajax-test.js', __FILE__ ), array('jquery'), '1.0', true );
    wp_localize_script( 'my-script-handler', 'ajax_test', array(
        'ajax_url' => admin_url( 'admin-ajax.php' )
    ));
}
function my_ajax_test() {
/**** Create Input Form ****************************/
?>
    <h2>Select Persons You Wish to Register</h2>

    <form action="">
    <input type="text" id="ajax_guest_name" name="guest_name">
    <p id="ajax_guest_text">Enter Guest Name</p>
    <br><br>
    <input type="button" id="ajax_rsvp" name="ajax_guest" value="Register Guest">
    </form> 

<?php   
add_action( 'wp_ajax_my_ajax_callback', 'my_ajax_callback' );

function my_ajax_callback() {
    $guest_name = $_POST[ajax_guest_name];
    echo $guest_name;
    die();
}
};

add_shortcode('My-AJAX-Test', 'my_ajax_test');

JS文件my-ajax-test.js看起来像这样：

// use wordpresses version of script
var $jq = jQuery.noConflict();

$jq(document).ready(function(){ 

$jq("#ajax_rsvp").click(function(){
/* Send guest name to server via AJAX */

    var g_name = document.getElementById("ajax_guest_name").value;
    alert("RSVP Button was clicked with Guest Name: " + g_name);

$jq.ajax({
    url : ajax_test.ajax_url,
    type : 'post',
    data : {
        action: 'my-ajax-test',
        ajax_guest_name : g_name
    },
    success:function(data) {
        // This outputs the result of the ajax request
        console.log(data);
    },
    error: function(errorThrown){
        console.log(errorThrown);
    }
}); // End of AJAX function

}); // End of button click function

}); // End of Main Document Ready Function

一切似乎都很好，但是单击按钮后没有任何内容发送到服务器。控制台日志有错误：

HTTP400：错误的请求-由于语法无效，服务器无法处理该请求。（XHR）POST-http://localhost:81/wordpress/wp-admin/admin-ajax.php

我一直在检查代码，以查看我有什么错误并找不到它。任何建议，将不胜感激。

Answer 1

您好，LCSF，欢迎来到StackOverflow。

您的代码中存在多个错误。当您应该将数据发布到my-ajax-test函数时，您正在将数据发布到my_ajax_test函数（不存在。主插件函数是my_ajax_callback）。那就是您通过wp_ajax动作钩子注册的功能。这就是Wordpress无法找到您要采取行动的原因。除此之外，您的回调函数还封装在主插件函数中，这就是即使更改Ajax请求也无法找到该函数的原因，因为它的范围很大。要解决此问题，请执行以下操作：

在您的JavaScript文件中，将Ajax函数中的action更改为my_ajax_callback

从my_ajax_callback函数中提取my_ajax_test函数。您的代码结构将如下所示：

function my_ajax_test(){ 
    //content 
}

add_action( 'wp_ajax_my_ajax_callback', 'my_ajax_callback' );

function my_ajax_callback(){
    //content
}

Answer 2

动作my-ajax-test不需要作为动作参数传递。

替换：

action: 'my-ajax-test',

具有：

action: 'my_ajax_callback',

来自WordPress的AJAX代码的http400错误请求

2 个答案: