[英]Wordpress: how to call a plugin function with an ajax call?
我正在編寫一個Wordpress MU插件,它包含每個帖子的鏈接,我想在用戶點擊此鏈接時使用ajax調用其中一個插件函數,然后使用該函數的輸出動態更新鏈接文本。
我堅持使用ajax查詢。 我有這種復雜的,明顯是黑客的方式,但它不是很有效。 在插件中包含ajax功能的'正確'或'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 '<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功能。 使用帶參數'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。
請看看:
文件: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調用觸發的函數。 記住后綴:
這些后綴加上操作組成了您的操作名稱:
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
}
希望能幫助到你!
如果有什么不清楚,請告訴我。
只是為了添加信息。 如果你想從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();
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.