Brian Fegter的回答是正确的,但也有一些错误。这里有一个基于相同原理的更完善的解决方案。
Step 1: PHP Logic.
放入函数。php(或插件文件)
// Saving the post via AJAX
add_action(\'save_post\', \'save_post_ajax\');
function save_post_ajax( $post_id )
{
# Ignore autosaves
if (defined(\'DOING_AUTOSAVE\') && DOING_AUTOSAVE)
return;
# Only enabled for one post type
# Remove this if statement if you want to enable for all post types
if ($_POST[\'post_type\'] == \'my_custom_post_type\')
{
# Send JSON response
# NOTE: We use ==, not ===, because the value may be String("true")
if (isset($_POST[\'save_post_ajax\']) && $_POST[\'save_post_ajax\'] == TRUE)
{
header(\'Content-type: application/json\');
echo json_encode(array(\'success\' => true));
# Don\'t return full wp-admin
exit;
}
}
}
Step 2: Create javascript in an external file
Brian将js直接回传到页面上的解决方案也很有效。
// Avoid collisions with other libraries
(function($) {
// Make sure the document is ready
$(document).ready(function() {
// This is the post.php url we localized (via php) above
var url = ajax_object.post_url;
// Serialize form data
var data = $(\'form#post\').serializeArray();
// Tell PHP what we\'re doing
// NOTE: "name" and "value" are the array keys. This is important. I use int(1) for the value to make sure we don\'t get a string server-side.
data.push({name: \'save_post_ajax\', value: 1});
// Replaces wp.autosave.initialCompareString
var ajax_updated = false;
/**
* Supercede the WP beforeunload function to remove
* the confirm dialog when leaving the page (if we saved via ajax)
*
* The following line of code SHOULD work in $.post.done(), but
* for some reason, wp.autosave.initialCompareString isn\'t changed
* when called from wp-includes/js/autosave.js
* wp.autosave.initialCompareString = wp.autosave.getCompareString();
*/
$(window).unbind(\'beforeunload.edit-post\');
$(window).on( \'beforeunload.edit-post\', function() {
var editor = typeof tinymce !== \'undefined\' && tinymce.get(\'content\');
// Use our "ajax_updated" var instead of wp.autosave.initialCompareString
if ( ( editor && !editor.isHidden() && editor.isDirty() ) ||
( wp.autosave && wp.autosave.getCompareString() != ajax_updated) ) {
return postL10n.saveAlert;
}
});
// Post it
$.post(url, data, function(response) {
// Validate response
if (response.success) {
// Mark TinyMCE as saved
if (typeof tinyMCE !== \'undefined\') {
for (id in tinyMCE.editors) {
var editor = tinyMCE.get(id);
editor.isNotDirty = true;
}
}
// Update the saved content for the beforeunload check
ajax_updated = wp.autosave.getCompareString();
console.log(\'Saved post successfully\');
} else {
console.log(\'ERROR: Server returned false. \',response);
}
}).fail(function(response) {
console.log(\'ERROR: Could not contact server. \',response);
});
});
})(jQuery);
Step 3: Enqueue your javascript file
如果你(像Brian一样)附和出来,你就不必这样做。我更喜欢这种方法,因为它允许我们将脚本出列,本地化变量,并轻松调整脚本加载顺序。
function my_post_type_xhr()
{
global $post;
# Only for one post type.
if ($post->post_type == \'custom_post_type\')
{
# The url for the js file we created above
$url = \'/url/to/my/javascript.js\';
# Register and enqueue the script, dependent on jquery
wp_register_script( \'my_script\', $url, array(\'jquery\') );
wp_enqueue_script( \'my_script\' );
# Localize our variables for use in our js script
wp_localize_script( \'my_script\', \'ajax_object\', array(
\'post_id\' => $post_id,
\'post_url\' => admin_url(\'post.php\'),
) );
}
}
add_action(\'admin_head-post.php\', \'my_post_type_xhr\');
add_action(\'admin_head-post-new.php\', \'my_post_type_xhr\');
此代码段不处理nonce。不管怎样,我希望这能帮助别人。