如何在 WordPress 短代碼中整合 AJAX 功能？

如何在 WordPress 短程式碼中使用 AJAX？

使用短程式碼實作 AJAX

PHP:

短程式碼的 PHP程式碼應包含以下：

function random_quote( $atts ) {
    // Extract shortcode attributes
    extract( shortcode_atts( array(
        'path' => get_template_directory_uri() . '/quotes.txt' // Default path
    ), $atts ) );

    // Retrieve quotes from file
    $array = file( $path );
    $r = rand( 0, count($array) - 1 );

    // Render shortcode output
    $output = '<div>

jQuery：

處理按鈕點選並執行AJAX 要求：

jQuery('#newquote').click( function() {
    // Send AJAX request to retrieve a new quote
    $.ajax({
        type: 'POST',
        url: ajaxParams.themeURI+'js/ajax-load-quote.php',
        data: { file_path: ajaxParams.filePath },
        beforeSend: function() {
            ajaxLoadingScreen(true,'#randomquotes');
        },
        success: function(data) {
            // Replace old quote with new one
            jQuery('#randomquotes').find('p').remove();
            jQuery('#randomquotes').prepend(data);
        },
        complete: function() {
            ajaxLoadingScreen(false,'#randomquotes');
        }
    });
    return false;
});

如何在WordPress 中使用AJAX短代碼

1. 創建PHP檔案： 在 JS 和 PHP 之間建立通訊點（例如 ajax-load-quote.php）。
2. 設定短程式碼： 編寫短程式碼以產生必要的 HTML 和 JS /AJAX 整合。
3. 載入必要的腳本： 入隊Functions.php 中所需的 JS 檔案（例如 wp_enqueue_script）。
4. JavaScript 中的 AJAX 呼叫： 使用 jQuery、XHR 或類似工具從 JS 發送 AJAX 請求。
5. 在 PHP 中處理 AJAX 請求：處理數據，執行必要的操作，然後返回修改後的內容。
6. 更新 JS 中的視圖：根據伺服器端 AJAX 請求的回應更新 HTML。

以上是如何在 WordPress 短代碼中整合 AJAX 功能？的詳細內容。更多資訊請關注PHP中文網其他相關文章！