为什么我的AJAX调用不起作用?

时间:2013-09-05 作者:Suzanne

我在一个主题的函数中有类似的代码。php文件,但我想将其移动到插件。我组装了以下内容,但由于某种原因,此方法在AJAX调用时遇到问题,并且总是返回零。

这里的目的是,表单将位于前端,可供登录或未登录的用户使用。

以下是我的插件代码:

/*
Plugin Name: AAA Hello World
Plugin URI: http://helloworld.com
Description: AJAX response to form submission
Version: 1.0
Author: John Doe
Author URI: http://helloworld.com
*/

class RespondToMyClicks {

  function __construct() {

    add_action( \'wp_enqueue_scripts\', array( &$this, \'click_response_styles\' ) );
    add_action( \'wp_enqueue_scripts\', array( &$this, \'click_response_scripts\' ) );

    if( is_admin() ) {
      add_action( \'wp_ajax_the_ajax_hook\', array( &$this, \'process_clicky_form\' ) );
      add_action( \'wp_ajax_nopriv_the_ajax_hook\', array( &$this, \'process_clicky_form\' ) );
    }

    add_shortcode( \'click_response_form\', array( &$this, \'click_response_form\' ) );

  }

  public function click_response_styles() {

    wp_register_style( \'respond-to-my-clicks\', plugins_url( dirname( plugin_basename( __FILE__ ) ) . \'/styles.css\' ) );
    wp_enqueue_style( \'respond-to-my-clicks\' );

  }

  public function click_response_scripts() {

    wp_enqueue_script( \'respond-to-my-clicks\', plugin_dir_url( __FILE__ ) . \'ajax.js\', array( \'jquery\' ) );
    wp_localize_script( \'respond-to-my-clicks\', \'the_ajax_script\', array( \'ajaxurl\' => admin_url( \'admin-ajax.php\' ) ) );

  }

  public function process_clicky_form() {
    if( !empty( $_POST ) && wp_verify_nonce( $_POST[\'post_filtration\'], \'post_filter_action\' ) ) {
      echo "Hello World";
      die();
    }
  }

  public function click_response_form() {
    $the_form = \'<form id="theForm" method="post" action="">\' . 
    wp_nonce_field( \'post_filter_action\', \'post_filtration\' ) . 
    \'<input name="action" type="hidden" value="the_ajax_hook" />
        <label class="check"><input type="checkbox" name="change_me"  value="" onChange="submit_me();" /> Click me for a response</label>
    </form>
    <div id="response_area"></div>\';
    return $the_form;
  }

}

new RespondToMyClicks();
下面是我的Javascript文件代码:

    function submit_me() {

        jQuery("#response_area").fadeOut("slow");

        jQuery.post(the_ajax_script.ajaxurl, 
        jQuery("#theForm").serialize(),
            function(response_from_the_action_function){
                jQuery("#response_area").html(response_from_the_action_function).fadeIn("fast");
            }
        )

    }
我已经看了太久了,并且尝试了不同的代码变体,所以希望有人能指出明显的原因,因为我只是错过了它。谢谢

1 个回复
最合适的回答,由SO网友:Suzanne 整理而成

好了,现在我有了完整的解决方案。有两件事:

缓存是问题的第一部分。清除缓存,暂时停用缓存插件

结束

相关推荐

如何使用JSONP向网络上不同站点发出AJAX请求

我正在尝试从子站点获取网络主站点上的buddypress头像。buddypress制作头像的方式实际上涉及循环和回退等,不包括任何数据库调用,这很简单。相反,我想也许我会在我的主站点上创建一个功能来输出用户的头像,然后用AJAX获取它。但是跨域策略已经生效,我很难理解如何实现JSONP来绕过它。我的javascript如下所示:$(\'.external-avatar\').each(function(){ var user_id = $(this).data(\'user