Wie integriere ich AJAX-Funktionalität in einen WordPress-Shortcode?

Wie verwende ich AJAX in einem WordPress-Shortcode?

AJAX mit einem Shortcode implementieren

PHP:

Der PHP-Code für den Shortcode sollte das enthalten Folgendes:

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:

Klicken Sie auf die Schaltfläche und führen Sie die AJAX-Anfrage aus:

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;
});

So verwenden Sie AJAX in WordPress Shortcodes

1. PHP-Datei erstellen:Stellen Sie eine Kommunikation her Punkt zwischen JS und PHP (z. B. ajax-load-quote.php).
2. Shortcode konfigurieren: Schreiben Sie den Shortcode, um die erforderlichen HTML- und JS/AJAX-Integrationen zu generieren.
3. Erforderliche Skripte laden: Stellen Sie die erforderliche JS-Datei in „functions.php“ in die Warteschlange (z. B. wp_enqueue_script).
4. AJAX-Aufruf in JavaScript:Verwenden Sie jQuery, XHR oder ähnliches, um AJAX-Anfragen von JS zu senden.
5. AJAX-Anfrage in PHP verarbeiten: Behandeln Sie die Daten, führen Sie die erforderlichen Vorgänge aus und geben Sie die geänderten Daten zurück Inhalt.
6. Ansicht in JS aktualisieren: Aktualisieren Sie den HTML-Code basierend auf der Antwort der serverseitigen AJAX-Anfrage.

Das obige ist der detaillierte Inhalt vonWie integriere ich AJAX-Funktionalität in einen WordPress-Shortcode?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!