WordPress:如何使用ajax调用调用插件函数?

我正在编写Wordpress MU插件,它包含每个post的链接,我想在用户点击此链接时使用ajax调用其中一个插件函数,然后使用该函数的输出动态更新链接文本。

我坚持使用ajax查询。 我有这种复杂的,明显是黑客的方式,但它不是很有效。 在插件中包含ajaxfunction的’正确’或’wordpress’方式是什么?

(我当前的黑客代码如下。当我点击生成链接时,我没有得到与wp页面相同的输出,就像我在浏览器中直接访问sample-ajax.php一样。)

我的代码[1]设置如下:

MU-插件/ sample.php:

<?php /* Plugin Name: Sample Plugin */ if (!class_exists("SamplePlugin")) { class SamplePlugin { function SamplePlugin() {} function addHeaderCode() { echo '\n'; wp_enqueue_script('sample-ajax', get_bloginfo('wpurl') . '/wp-content/mu-plugins/sample/sample-ajax.js.php', array('jquery'), '1.0'); } // adds the link to post content. function addLink($content = '') { $content .= "click"; return $content; } function doAjax() { // echo "AJAX!"; } } } if (class_exists("SamplePlugin")) { $sample_plugin = new SamplePlugin(); } if (isset($sample_plugin)) { add_action('wp_head',array(&$sample_plugin,'addHeaderCode'),1); add_filter('the_content', array(&$sample_plugin, 'addLink')); } 

MU-插件/样品/试样ajax.js.php:

  jQuery(document).ready(function(){ jQuery(".foobar").bind("click", function() { var aref = this; jQuery(this).toggleClass('clicked'); jQuery.ajax({ url: "http://mysite/wp-content/mu-plugins/sample/sample-ajax.php", success: function(value) { jQuery(aref).html(value); } }); }); }); 

MU-插件/样品/试样ajax.php:

 doAjax(); } else { echo "unset"; } ?> 

[1]注意:以下教程对我有所帮助,但此刻我很难过。 http://www.devlounge.net/articles/using-ajax-with-your-wordpress-plugin

TheDeadMedic不太对劲。 WordPress内置了AJAXfunction。 使用带参数’action’的POST将您的ajax请求发送到/wp-admin/admin-ajax.php:

 jQuery(document).ready(function(){ jQuery(".foobar").bind("click", function() { jQuery(this).toggleClass('clicked'); jQuery.ajax({ type:'POST', data:{action:'my_unique_action'}, url: "http://mysite/wp-admin/admin-ajax.php", success: function(value) { jQuery(this).html(value); } }); }); }); 

然后将它挂在插件中,如果您只希望它对登录用户有用:

 add_action('wp_ajax_my_unique_action',array($sample_plugin,'doAjax')); 

或者像这样挂钩它只适用于非登录用户:

 add_action('wp_ajax_nopriv_my_unique_action',array($sample_plugin,'doAjax')); 

如果您希望它适用于每个人,请同时使用它们。

admin-ajax.php已经使用了一些动作名称,因此请确保查看该文件并且不要使用相同的动作名称,否则您将意外尝试执行删除注释等操作。

编辑

对不起,我不太明白这个问题。 我以为你在问如何做一个ajax请求。 无论如何,我要尝试两件事:

首先,让你的函数回显一下没有a标签的单词AJAX。 接下来,尝试更改您的ajax调用,以便它既有成功又有完整的回调:

 jQuery(document).ready(function(){ jQuery(".foobar").bind("click", function() { var val = ''; jQuery(this).toggleClass('clicked'); jQuery.ajax({ type:'POST', data:{action:'my_unique_action'}, url: "http://mysite/wp-admin/admin-ajax.php", success: function(value) { val = value; }, complete: function(){ jQuery(this).html(val); } }); }); }); 

WordPress环境

首先,为了完成这项任务,建议注册然后将jQuery脚本排入队列,将脚本推送到服务器。 这些操作将挂钩在wp_enqueue_scripts动作钩子中。 在同一个钩子中你应该把它用于包含任意Javascript的wp_localize_script 。 通过这种方式,前端将有一个JS对象。 该对象进行jQuery句柄使用的正确url。

请看看:

  1. wp_register_script(); function
  2. wp_enqueue_scripts钩子
  3. wp_enqueue_script(); function
  4. wp_localize_script(); function

文件:functions.php 1/2

 add_action( 'wp_enqueue_scripts', 'so_enqueue_scripts' ); function so_enqueue_scripts(){ wp_register_script( 'ajaxHandle', get_template_directory() . 'PATH TO YOUR JS FILE', array(), false, true ); wp_enqueue_script( 'ajaxHandle' ); wp_localize_script( 'ajaxHandle', 'ajax_object', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) ); } 

文件:jquery.ajax.js

该文件进行ajax调用。

 jQuery(document).ready( function($){ //Some event will trigger the ajax call, you can push whatever data to the server, simply passing it to the "data" object in ajax call $.ajax({ url: ajax_object.ajaxurl, // this is the object instantiated in wp_localize_script function type: 'POST', data:{ action: 'myaction', // this is the function in your functions.php that will be triggered name: 'John', age: '38' }, success: function( data ){ //Do something with the result from server console.log( data ); } }); }); 

文件:functions.php 2/2

最后在你的functions.php文件中应该有你的ajax调用触发的函数。 记住后缀:

  1. wp_ajax(仅限注册用户或管理面板操作的function)
  2. wp_ajax_nopriv(允许无特权用户的function)

这些后缀加上操作组成了您的操作名称:

wp_ajax_myactionwp_ajax_nopriv_myaction

 add_action( 'wp_ajax_myaction', 'so_wp_ajax_function' ); add_action( 'wp_ajax_nopriv_myaction', 'so_wp_ajax_function' ); function so_wp_ajax_function(){ //DO whatever you want with data posted //To send back a response you have to echo the result! echo $_POST['name']; echo $_POST['age']; wp_die(); // ajax call must die to avoid trailing 0 in your response } 

希望能帮助到你!

如果有什么不清楚,请告诉我。

只是为了添加信息。 如果你想从php类方法函数接收一个对象:

js文件

 jQuery(document).ready(function(){ jQuery(".foobar").bind("click", function() { var data = { 'action': 'getAllOptionsByAjax', 'arg1': 'val1', 'arg2': $(this).val() }; jQuery.post( ajaxurl, data, function(response) { var jsonObj = JSON.parse( response ); }); }); 

php文件

 public static function getAllOptionsByAjax(){ global $wpdb; // Start query string $query_string = "SELECT * FROM wp_your_table WHERE col1='" . $_POST['arg1'] . "' AND col2 = '" . $_POST['arg2'] . "' "; // Return results $a_options = $wpdb->get_results( $query_string, ARRAY_A ); $f_options = array(); $f_options[null] = __( 'Please select an item', 'my_domain' ); foreach ($a_options as $option){ $f_options [$option['id']] = $option['name']; } $json = json_encode( $f_options ); echo $json; wp_die(); }