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. 필요한 스크립트 로드: 필요한 JS 파일을 function.php(예: wp_enqueue_script)에 대기열에 넣습니다.
4. JavaScript에서 AJAX 호출: JS에서 AJAX 요청을 보내려면 jQuery, XHR 또는 이와 유사한 것을 사용하세요.
5. PHP에서 AJAX 요청 처리: 데이터 처리, 필요한 작업 수행, 수정된 콘텐츠를 반환합니다.
6. JS에서 보기 업데이트: 서버측 AJAX 요청의 응답을 기반으로 HTML을 업데이트합니다.

위 내용은 WordPress 단축 코드 내에 AJAX 기능을 통합하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!