Wordpress 使用 Wordpress 将 ajax 值传递到特定页面

Posted 2023-02-22

【中文标题】Wordpress 使用 Wordpress 将 ajax 值传递到特定页面

【英文标题】：Wordpress passing ajax value to a specific page using Wordpress

【发布时间】：2016-10-07 07:54:29

【问题描述】：

我想将变量传递给特定页面。我找到了一个简单的例子来解释如何在 wordpress 中使用 ajax。

JavaScript：

jQuery(document).ready(function($) 

// We'll pass this variable to the php function example_ajax_request
var fruit = 'Banana';

// This does the ajax request
$.ajax(
    url: ajaxurl,
    data: 
        'action':'example_ajax_request',
        'fruit' : fruit
    ,
    success:function(data) 
        // This outputs the result of the ajax request
        console.log(data);
    ,
    error: function(errorThrown)
        console.log(errorThrown);
    
);  

);

要插入functions.php的PHP片段

function example_ajax_request() 

// The $_REQUEST contains all the data sent via ajax
if ( isset($_REQUEST) ) 

    $fruit = $_REQUEST['fruit'];

    // Let's take the data that was sent and do something with it
    if ( $fruit == 'Banana' ) 
        $fruit = 'Apple';
    

    // Now we'll return it to the javascript function
    // Anything outputted will be returned in the response
    echo $fruit;

    // If you're debugging, it might be useful to see what was sent in the $_REQUEST
    // print_r($_REQUEST);



// Always die in functions echoing ajax content
  die();
 

add_action( 'wp_ajax_example_ajax_request', 'example_ajax_request' );


   wp_localize_script( 'ajax-script', 'ajax_object', array( 'ajax_url' =>   admin_url( 'admin-ajax.php' ) ) );

不幸的是，我无法传递变量。我检查了代码，我得到了这个错误：

Error: ajax_object is not defined

您可能知道获得相同结果的另一种方法吗？

【问题讨论】：

wp_localize_script 期望有一个名为 ajax_object 的变量，所以您可以尝试对此发表评论并查看它是否有效，这样您就可以知道错误来自那里吗？

嗨，LoicTheAtzec 我不太明白你的例子。我可以请您使用 blockquote 写下您的建议吗？

【参考方案1】：

你已经很近了，但是少了一些小东西……

我在评论中的意思是，您需要在两者中都使用 'ajax-script' 以这种方式使用它：

add_action('wp_enqueue_scripts', 'add_js_scripts'); 
add_js_scripts()
    wp_enqueue_script( 'ajax-script', get_template_directory_uri().'/js/script.js', array('jquery'), '1.0', true );
    wp_localize_script( 'ajax-script', 'ajax_object', array( 'ajaxurl' =>   admin_url( 'admin-ajax.php' ) ) );

将 $_REQUEST 更改为 $_POST:

function example_ajax_request() 

    // The $_REQUEST contains all the data sent via ajax
    if ( isset($_POST) ) 

        $fruit = $_POST['fruit'];

        // Let's take the data that was sent and do something with it
        if ( $fruit == 'Banana' ) 
            $fruit = 'Apple';
        

        // Now we'll return it to the javascript function
        // Anything outputted will be returned in the response
        echo $fruit;

        // If you're debugging, it might be useful to see what was sent in the $_POST
        // print_r($_POST);

    

    // Always die in functions echoing ajax content
      die();

 

添加add_action( 'wp_ajax_nopriv_ … )：

add_action( 'wp_ajax_nopriv_example_ajax_request', 'example_ajax_request' ); // <= this one
add_action( 'wp_ajax_example_ajax_request', 'example_ajax_request' );

对于您的 jQuery 脚本 script.js 文件，有 2 个重要的缺少的小东西：

jQuery(document).ready(function($) 

    /* We'll pass this variable to the PHP function example_ajax_request */
    var fruit = 'Banana';

    /* This does the ajax request */
    $.ajax(
        url: ajax_object.ajaxurl, /* <====== missing here */
        type : 'post', /*    <========== and missing here */
        data: 
            'action':'example_ajax_request',
            'fruit' : fruit
        ,
        success:function(data) 
            /* This outputs the result of the ajax request */
            console.log(data);
        ,
        error: function(errorThrown)
            console.log(errorThrown);
        
    );  

);

现在应该可以工作了……

参考资料：

Using AJAX With PHP on Your WordPress Site Without a Plugin

How to use Ajax with your WordPress Plugin or Theme?

【参考方案2】：

您使用 wp_localize_script 错误。在 PHP 代码中，删除 wp_localize_script 行。

您可以（并且应该）添加以下内容

// this line is for users who are not logged in
add_action( 'wp_ajax_nopriv_example_ajax_request', 'example_ajax_request' );

【参考方案3】：

一切都是正确的，除了你必须添加 ajax_object.ajax_url 而不是 url 中的 ajaxurl：$.ajax 函数的参数 as

jQuery(document).ready(function($) 

// We'll pass this variable to the PHP function example_ajax_request
var fruit = 'Banana';

// This does the ajax request
$.ajax(
    url: **ajax_object.ajax_url**,
    data: 
        'action':'example_ajax_request',
        'fruit' : fruit
    ,
    success:function(data) 
        // This outputs the result of the ajax request
        console.log(data);
    ,
    error: function(errorThrown)
        console.log(errorThrown);
    
);  

);

复制并粘贴上面的脚本来代替你的 $.ajax 函数 如果你想看看 ajax_object.ajax_url 是什么 在你的代码中提醒它，它会提醒你的管理 ajax 文件的路径 这是在 wordpress 中使用 ajax 所必需的