WordPress 中的 AJAX 没有响应答案

【问题标题】：No response from AJAX in WordPressWordPress 中的 AJAX 没有响应
【发布时间】：2020-03-03 23:28:14
【问题描述】：

在我的模板中，我有一个按钮，按下时我应该得到“单击下一步”。然后，当发布请求得到响应时，我应该得到“得到响应！”在控制台中，但我只收到第一条消息。

这是在我的 js/inputtitle_submit.js：

jQuery(document).ready(function($) {
        console.log('js loaded!');
        $('#next').click(function () {
            console.log('Next is clicked!');
            var data = {
                'action': 'myajax_inputtitleSubmit_func', // wp ajax action
                'title': $('input[name=title]').val(), // vars
                'nextNonce': PT_Ajax.nextNonce // send the nonce along with the request
            };
            $.post(PT_Ajax.ajaxurl, data, function(response){
                console.log('Got response!');
            });
        });
    });

这是我的function.php：

add_action( 'wp_enqueue_scripts', 'twentyseventeen_child_scripts' );
add_action( 'wp_ajax_myajax_inputtitleSubmit_func', 'myajax_inputtitleSubmit_func' );
add_action( 'wp_ajax_nopriv_myajax_inputtitleSubmit_func', 'myajax_inputtitleSubmit_func' );

//Function to load js an localize vars
function twentyseventeen_child_scripts() {
    wp_enqueue_script( 'inputtitle_submit', '/wp-content/themes/twentyseventeen-child' . '/js/inputtitle_submit.js', array( 'jquery' ) );
    wp_localize_script( 'inputtitle_submit', 'PT_Ajax', array(
        'ajaxurl'   => admin_url( 'admin-ajax.php' ),
        'nextNonce' => wp_create_nonce( 'myajax-next-nonce' )
        )
    );
}

//Function to return a response to an ajax call
function myajax_inputtitleSubmit_func() {
    // check nonce
    $nonce = $_POST['nextNonce'];
    if ( ! wp_verify_nonce( $nonce, 'myajax-next-nonce' ) ) {
        die ( 'Busted!' );
    }
    echo "response";
    exit;
}

【问题讨论】：

你的#next按钮是<form>中的提交按钮吗？
你为什么不也分享相关的HTML？

标签： jquery ajax wordpress

【解决方案1】：

我已经编写了一些更改的代码，希望它对你有用

add_action( 'wp_enqueue_scripts', 'twentyseventeen_child_scripts' );
//Function to load js an localize vars
function twentyseventeen_child_scripts() {

   wp_enqueue_script( 'inputtitle_submit', get_stylesheet_directory_uri().'/js/inputtitle_submit.js', array( 'jquery' ), '1.0', true );

    $data = array(
        'ajaxurl'=> admin_url( 'admin-ajax.php')
    );
    wp_localize_script( 'inputtitle_submit', 'PT_Ajax', $data );


}

add_action( 'wp_ajax_myajax_inputtitleSubmit_func', 'myajax_inputtitleSubmit_func');
add_action( 'wp_ajax_nopriv_myajax_inputtitleSubmit_func', 'myajax_inputtitleSubmit_func');
function myajax_inputtitleSubmit_func(){

    $myArr = array(
        'response' => 'xyz'
    );
    $myJSON = json_encode($myArr); 
    echo $myJSON;
    die();
}

过去的外部 js 文件

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

        jQuery(document).on('click', '#next', function(){

            var title = jQuery('input[name=title]').val();

            jQuery.ajax({
                url: PT_Ajax.ajaxurl,
                type: "POST",
                data: {'action': 'myajax_inputtitleSubmit_func', title: title},
                cache: false,
                dataType: 'json',
                beforeSend: function(){
                },
                complete: function(){
                },
                success: function (response) { 

                    console.log(response);
                }
            });

        });

    });

我已经测试过这段代码可以正常工作。

【讨论】：