第一块代码是PHP,第二块是javascript。
下面是一个完整的示例:
在PHP(主题的functions.PHP文件或插件文件)中:
//First enqueue your javascript in WordPress
function your_prefix_enqueue_scripts(){
//Enqueue your Javascript (this assumes your javascript file is located in your plugin in an "includes/js" directory)
wp_enqueue_script( \'your_unique_js_name\', plugins_url(\'js/yourjavascriptfile.js\', dirname(__FILE__) ), array( \'jquery\' ) );
//OR (simpler but not recommended)
wp_enqueue_script( \'your_unique_js_name\', \'http://domain.com/myjavascriptfile.js\', array( \'jquery\' ) );
//Here we create a javascript object variable called "youruniquejs_vars". We can access any variable in the array using youruniquejs_vars.name_of_sub_variable
wp_localize_script( \'your_unique_js_name\', \'youruniquejs_vars\',
array(
//To use this variable in javascript use "youruniquejs_vars.ajaxurl"
\'ajaxurl\' => admin_url( \'admin-ajax.php\' ),
)
);
}
add_action( \'wp_enqueue_scripts\', \'your_prefix_enqueue_scripts\' );
然后在PHP中,创建ajax回调函数:
//This is your Ajax callback function
function your_ajax_callback_function_name(){
//Get the post data
$my_var = $_POST["my_var"];
//Do your stuff here - maybe an update_option as you mentioned...
//Create the array we send back to javascript here
$array_we_send_back = array( \'test\' => "Test" );
//Make sure to json encode the output because that\'s what it is expecting
echo json_encode( $array_we_send_back );
//Make sure you die when finished doing ajax output.
die();
}
add_action( \'wp_ajax_\' . \'wpa_49691\', \'your_ajax_callback_function_name\' );
add_action( \'wp_ajax_nopriv_\' . \'wpa_49691\', \'your_ajax_callback_function_name\' );
然后在javascript文件中执行以下操作:
jQuery(document).ready(function($){
/**
* When your ajax trigger button is clicked
* (if the button\'s class is .my-button)
*
*/
$( document ).on( \'click\', \'.my-button\', function(event){
event.preventDefault();
// Use ajax to do something...
var postData = {
action: \'wpa_49691\',
my_var: \'my_data\',
}
//Ajax load more posts
$.ajax({
type: "POST",
data: postData,
dataType:"json",
url: youruniquejs_vars.ajaxurl,
//This fires when the ajax \'comes back\' and it is valid json
success: function (response) {
alert( response.test );
}
//This fires when the ajax \'comes back\' and it isn\'t valid json
}).fail(function (data) {
console.log(data);
});
});
});