Wordpress:如何通过ajax调用插件函数?
我正在写一个Wordpress MU插件,它包括一个链接,每个帖子,我想用ajax来调用其中一个插件功能,当用户点击这个链接,然后动态更新链接文本的输出该功能。Wordpress:如何通过ajax调用插件函数?
我被ajax查询卡住了。我有这种复杂的,明显的黑客方式来做到这一点,但它并不完美。在插件中包含ajax功能的“正确”或“wordpress”方式是什么?
(我现在的黑客代码如下。当我点击链接生成我没有得到相同的输出我在wp页面获得,当我直接去采样ajax.php在我的浏览器。)
我有我的代码[1]设置如下:
MU-插件/ sample.php:
<?php
/*
Plugin Name: Sample Plugin
*/
if (!class_exists("SamplePlugin")) {
class SamplePlugin {
function SamplePlugin() {}
function addHeaderCode() {
echo '<link type="text/css" rel="stylesheet" href="'.get_bloginfo('wpurl').
'/wp-content/mu-plugins/sample/sample.css" />\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 .= "<span class='foobar clicked'><a href='#'>click</a></span>";
return $content;
}
function doAjax() { //
echo "<a href='#'>AJAX!</a>";
}
}
}
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:
<?php
if (!function_exists('add_action')) {
require_once("../../../wp-config.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:
<?php
if (!function_exists('add_action')) {
require_once("../../../wp-config.php");
}
if (isset($sample_plugin)) {
$sample_plugin->doAjax();
} else {
echo "unset";
}
?>
[1]注:下面的教程让我这么远,但我在这一点难倒。 http://www.devlounge.net/articles/using-ajax-with-your-wordpress-plugin
TheDeadMedic不太对。 WordPress内置了AJAX功能。发送您的Ajax请求使用POST与参数“行动”,以/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
的动作钩子中。在相同的钩子你应该把wp_localize_script
,它被用来包括任意的Javascript。通过这种方式,将在前端提供一个JS对象。这个对象继承了jQuery句柄使用的正确url。
请看一看到:
文件:1/2的functions.php
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调用触发的功能。 记住后缀:
- wp_ajax(允许功能只对注册用户或管理员面板操作)
- wp_ajax_nopriv(允许的功能没有权限的用户)
这些后缀加上动作构成你行动的名称:
wp_ajax_myaction
或wp_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
}
希望它有帮助!
让我知道如果有什么不清楚。
add_action('wp_ajax_nopriv_myaction','so_wp_ajax_function'); – Akyegane 2013-10-06 05:13:43
只是为了添加信息。 如果您希望收到一个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();
}
我忘了补充一点,管理-ajax.php负责加载整个WordPress环境,所以你不必担心在你的插件中包含任何文件。 – 2010-05-26 13:24:45
您的原始答案很棒。感谢您向我展示在wp中执行ajax的正确方法。您的解释清楚了我在阅读的其他代码中看到的内容。 注意:我也有一个javascript范围的错误,我在问题中修正了上面的问题,所以它可能是一个更有用的wp引用问题,而不是'修复我特定的愚蠢bug'问题。(在ajax调用的成功fn中引用'this')。 – Bee 2010-05-26 14:44:36
John P是死对头,我道歉,我的解决方案是**不是唯一的方法,但它是一种方法,我觉得很容易快速AJAX,而不必自己加载WordPress。 – TheDeadMedic 2010-05-26 15:28:59