WordPress 提供了多種與頁面互動的方式，而無需重新載入整個頁面。其中之一是使用 AJAX（非同步 JavaScript 和 XML）。它允許網頁和伺服器之間進行非同步資料交換。這對於更新頁面上的內容而不重新加載整個頁面非常有用。
在這種情況下，我們將示範如何在 WordPress 短程式碼中使用 AJAX 更新內容。此方法涉及為短程式碼建立 PHP 函數、JavaScript 中的 AJAX 請求以及在伺服器端處理請求的函數。
步驟：
程式碼範例：
短程式碼的PHP 函數（例如update_content）
function update_content( $atts ) {
wp_enqueue_script( 'ajax-update-content', get_template_directory_uri() . '/js/ajax-update-content.js', array( 'jquery' ), '1.0.0', true );
$content = get_transient( 'content' ); // Simulated content, normally retrieved via AJAX.
return $content;
}
add_shortcode( 'update_content', 'update_content' );（例如update_content）
jQuery(document).ready(function($) {
$('#update-content-button').click(function(e) {
e.preventDefault();
$.ajax({
url: ajaxurl, // AJAX URL defined in WordPress
type: 'POST',
data: {
action: 'update_content_action', // Defined in the server-side function.
security: '<%= wpApiSettings.nonce %>' // This is provided by WordPress.
},
success: function(response) {
$('#content-container').html(response); // Update the content.
}
});
});
});>JavaScript 中的AJAX 請求
（例如， ajax-update-content.js)add_action( 'wp_ajax_update_content_action', 'update_content_action' );
add_action( 'wp_ajax_nopriv_update_content_action', 'update_content_action' ); // Non-logged-in users.
function update_content_action() {
check_ajax_referer( 'nonce-value', 'security' ); // Security check.
$content = get_transient( 'content' ); // Simulated content.
echo $content; // Send the content back to the frontend.
wp_die();
}以上是如何使用 AJAX 非同步更新 WordPress 內容？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
