Question

我一直关注这方面的多个教程（包括Wordpress＆＃39; s），这让我有点疯狂。

我试图让AJAX在Wordpress的前端工作，但它根本就没有做任何事情，我知道这个功能正常，因为我已经独立测试过，你的输入将非常受欢迎。非常感谢提前。

functions.php中的代码

    function call_ajax()
{
    //assuming this is in a theme?
    wp_enqueue_script( 'ajax_car_models', get_template_directory_uri() . '/js/ajax_car_models.js', array( 'jquery' ), null, true);

    //loacalize the script using the same handle it was registered / enqueued with
    wp_localize_script( 'ajax_car_models', 'my_ajax_script', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );    
}

//make a call to call_ajax at the right time
add_action( 'wp_enqueue_scripts', 'call_ajax' );




add_action( 'wp_ajax_ajax_car_models', 'ajax_car_models' );
add_action( 'wp_ajax_nopriv_ajax_car_models', 'ajax_car_models' );



function ajax_car_models() {



    $args = array( 'post_type' => 'product', 'posts_per_page' => 1040 );
$loop1 = new WP_Query( $args );

$code = '';

$car_make = 26;

$all_models = array();

while ( $loop1->have_posts() ) : $loop1->the_post();

$terms_make = get_the_terms( get_the_id(), 'pa_car-make' );

foreach ( $terms_make as $make ) {

    if ( $make->term_id == $car_make ) {

    $the_car_model = get_the_terms( get_the_id(), 'pa_model' );


        foreach ( $the_car_model as $the_model ) {

            if ($all_models[$the_model->name] != 'true') {

                $code .= '<br />'.$the_model->name.' ';

                $all_models[$the_model->name] = 'true';
            }
        }
    }

}


endwhile;

wp_reset_postdata();

header( 'Content-type: application/json' );
echo json_encode( $code );
die();

}

jQuery本身：

    jQuery( document ).ready(function() {


    jQuery('#car-make').change(my_js_function);

    function my_js_function() 
{
     jQuery.ajax({
     url: my_ajax_script.ajaxurl,
     dataType: 'json',   // add this line
     data: ({action : 'ajax_car_models'}),
     success: function() {
      jQuery("#feedback").html(data);
     }
     });

    }

});

Answer 1

根据PHP手册json_encode，需要对字符串数据进行UTF8编码。

或者，您可以尝试在functions.php ...

中执行此操作

$return_array = array(
   'val' => $code
);
echo json_encode($return_array);

然后，在你的jQuery脚本中......

jQuery("#feedback").html(data.val);

另外，请尝试向您的ajax请求添加一个选项......

 url: my_ajax_script.ajaxurl,
 dataType: 'json',   // add this line
 data: ({action : 'ajax_car_models'}),

希望这些帮助！

Answer 2

如果您在内嵌javascript，则无法使用localize将其传递给ajax网址。

您应该将javascript移动到其他文件中，然后使用wp_enqueue_script以正确使用ajax。

function call_ajax()
{
    //assuming this is in a theme?
    wp_enqueue_script( 'ajax_car_models', get_template_directory_uri() . '/js/ajax_car_models.js', array( 'jquery' ), null, true);

    //loacalize the script using the same handle it was registered / enqueued with
    wp_localize_script( 'ajax_car_models', 'my_ajax_script', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );    
}

//make a call to call_ajax at the right time
add_action( 'wp_enqueue_scripts', 'call_ajax' );

您还需要在响应函数中发送json标头

header( 'Content-type: application/json' );
echo json_encode( $code );
exit();

在您的ajax调用中，您没有将数据传递给成功回调

success: function(data){
    console.log(data);
    //...
}

您可以使用chrome开发人员工具上的网络标签查看实际发出的请求，并检查他们收到的响应。

无法使Wordpress AJAX正常工作

2 个答案: