Question

这是我的情况：我有一张幻灯片，如下图所示，需要响应。这张幻灯片是从头开始创建的，可以正常工作，但是没有响应。

为了做出响应，我需要知道用户屏幕的宽度，所以我不显示4张幻灯片，而是显示3、2和1（如果是手机）。

话虽如此，我需要通过ajax加载滑块，然后通过参数来传递用户屏幕宽度。

我的主题文件夹的结构如下：

wp-contents/themes/my-theme
...functions.php
...header.php
...footer.php
...index.php
...single.php

我需要对我创建的函数进行functions.php的Ajax调用。所以我添加了以下内容：

add_action('wp_ajax_posts_list', 'my_ajax_posts_list_handler');

function my_ajax_posts_list_handler() 
{
    echo 'hello, width: ' . $_POST['width'];
    wp_die();
}

在footer.php文件中，我添加了一些测试javascript代码：

$(function()
{
    var width   = $(window).width();
    var ajaxurl = '<?php echo admin_url('admin-ajax.php'); ?>'; // Dunno what is this..

    $.ajax(
    {
        url: ajaxurl,
        data: 
        {
            action: 'wp_ajax_posts_list',
            width: width
        },
        type: 'GET',
        success: function(response)
        {
            console.log(response);
        }
    });
});

我的问题：

正在执行的URL是这个http://localhost/wordpress/wp-admin/admin-ajax.php?action=wp_ajax_posts_list
URL响应代码为400
URL响应者值为'0'

Answer 1

该动作实际上称为post_list。 wp_ajax_只是一个前缀。您还应该添加带有前缀wp_ajax_nopriv_的相同操作，否则注销后将无法使用。我还看到您在JavaScript中执行了type: 'GET'，但在PHP中使用了$_POST。做两个之一。

add_action('wp_ajax_posts_list', 'my_ajax_posts_list_handler');
add_action('wp_ajax_nopriv_posts_list', 'my_ajax_posts_list_handler');

function my_ajax_posts_list_handler()
{
    echo 'hello, width: ' . $_POST['width'];
    wp_die();
}

这里是JS：

<script>
    $( function () {
        var width = $( window ).width();

        // var ajaxurl = "http://localhost/wordpress/wp-admin/admin-ajax.php"
        var ajaxurl = '<?php echo admin_url( 'admin-ajax.php' ); ?>';

        $.ajax( {
            url: ajaxurl,
            data: {
                action: 'posts_list',
                width: width
            },
            type: 'POST',
            success: function ( response ) {
                console.log( response );
            }
        } );
    } );
</script>

WordPress使Ajax成为我的主题

1 个答案: