如何在 WordPress 短代码中使用 AJAX 显示随机引号？

如何在 WordPress 短代码中使用 AJAX 生成随机引号

问题：

我们如何使用更新页面内容阿贾克斯在WordPress？

答案：

这是问题中提供的代码的增强版本，它在 WordPress 短代码中实现 AJAX 功能以显示随机引号：

短代码(shortcode.php)

function random_quote_shortcode( $atts ) {
    $atts = shortcode_atts( array(
        'path' => get_template_directory_uri() . '/quotes.txt'
    ), $atts );

    $quotes = file( $atts['path'] );
    $random_quote = $quotes[array_rand($quotes)];

    $output = sprintf(
        '<div>

AJAX 处理程序 (ajax-handler.php)

add_action( 'wp_ajax_load_random_quote', 'load_random_quote' );
add_action( 'wp_ajax_nopriv_load_random_quote', 'load_random_quote' );

function load_random_quote() {
    $quotes = file( $_POST['file_path'] );
    $random_quote = $quotes[array_rand($quotes)];

    echo $random_quote;
    wp_die();
}

jQuery 脚本(ajax-script.js)

jQuery(document).ready(function($) {
    $('#newquote').click(function(e) {
        e.preventDefault();

        $.ajax({
            url: ajaxurl,
            data: {
                action: 'load_random_quote',
                file_path: '<?php echo get_template_directory_uri() . '/quotes.txt'; ?>'
            },
            success: function(data) {
                $('#randomquote').html(data);
            }
        });
    });
});

将脚本入队并本地化数据 (functions.php)

function enqueue_ajax_scripts() {
    wp_enqueue_script( 'ajax-script', get_template_directory_uri() . '/js/ajax-script.js', array('jquery'), '1.0.0', true );
    wp_localize_script( 'ajax-script', 'ajax_object', array(
        'ajax_url' => admin_url( 'admin-ajax.php' )
    ) );
}

add_action( 'wp_enqueue_scripts', 'enqueue_ajax_scripts' );

说明:

1. 简码random_quote 生成一个初始随机报价和一个标记为“New Quote”的按钮。
2. 单击“New Quote”按钮时，jQuery 会处理 AJAX 请求。
3. 处理函数 load_random_quote 返回一个新的随机报价，然后由 jQuery 显示以代替前一个报价。
4. 为了防止安全问题，AJAX 随机数已实施。

附加说明：

如果您使用自定义主题，请将 get_template_directory_uri() 替换为适合您主题的函数。

以上是如何在 WordPress 短代码中使用 AJAX 显示随机引号？的详细内容。更多信息请关注PHP中文网其他相关文章！