Question

我是wordpress的新手，我想尝试使用ajax调用来进行一些鼠标点击事件。我有一些基本代码来测试它是否有效。在我的插件文件plugin.php

中

function my_scripts() {
  $plugin_url = plugin_dir_url( __FILE__ );
  wp_register_script('search-filter',$plugin_url .  'js/search-filter.js',array(), filemtime( plugin_dir_path( __FILE__ ) .  'js/search-filter.js' ));
  wp_localize_script( 'search-filter', 'my_ajax_call', array( 'ajax_url' => admin_url('admin-ajax.php')) );
  wp_enqueue_script( 'search-filter');
}
add_action( 'wp_enqueue_scripts', 'my_scripts' );
function myAjaxHanlder(){
  var_dump("THIS IS A TEST");
  echo '<script>console.log("MY AJAX HANDLER")</script>';
}
add_action('wp_ajax_hello_world', 'myAjaxHanlder' );
add_action('wp_ajax_nopriv_hello_world', 'myAjaxHanlder' );

和我的javascript文件search-filter.js

(function($){

$(document).ready(function(){
    $(".search-hits").click(function(e){
        e.preventDefault();
        // var gender = $("#gender").val()||[];
        // var brand =$("#brand").val() || [];
        // var color =$("#color").val() || [];
        // var gender_JSON = JSON.stringify(gender);
        $.ajax({
            type: 'POST',
            dataType: 'json',
            crossDomain : true,
            url: my_ajax_call.ajax_url,
            data: {action:'hello_world', query:"nike"},
            success: function(response){
                alert(response);
            }

            });
       });
   });

})(jQuery);

我能够使用ajax发送数据，但myAjaxHanlder函数没有被执行。

Answer 1

我认为你不正确地接近它，而WP处理Ajax的方式不同。您的Ajax处理函数应该包含在两个钩子中（对于管理员和前端），如下所示：

add_action('wp_ajax_hello_world', 'hello_world' );
add_action('wp_ajax_nopriv_hello_world', 'hello_world' );

处理程序函数名称也必须用于Ajax调用（您已经完成）：

data: {action:'hello_world' ...

它还必须回应一个响应，然后死掉。我建议使用WP的die()实现：

wp_die();

这是我改造的内容，希望它有所帮助：

＆＃13;

function hello_world(){
  var_dump("THIS IS A TEST");

  echo '<script>console.log("MY AJAX HANDLER")</script>';

  // OR

  echo $_POST['query'];
  
  wp_die();
}
add_action('wp_ajax_hello_world', 'hello_world' );
add_action('wp_ajax_nopriv_hello_world', 'hello_world' );

＆＃13;

Codex有更多信息：Ajax on WP Plugins

使用动作钩子在wordpress中调用Ajax

1 个答案: