【问题标题】:Converting Javascript data to PHP using ajax in wordpress plugin development在 wordpress 插件开发中使用 ajax 将 Javascript 数据转换为 PHP
【发布时间】:2021-06-24 14:09:22
【问题描述】:

我正在构建我的第一个 wordpress 插件,但在将 Javascript 对象数组转换为 PHP 时遇到了问题,因此我可以使用这些数据在 wp-admin 用户区域中创建单独的表。

在我实际包含对象之前,我想我会尝试只使用一个变量。

首先,我在 wp_localize_script 中包含了 wp-admin/admin-ajax.php url,以便在我的 Javascript 文件中使用。

function addition_js_script() {
   
    wp_enqueue_script(
        'dynamic-maths-addition-js',
        DYNAMIC_MATHS_URL . 'includes/shortcodes/addition/addition.js',
        ['jquery'],
        time(),
        true 
    );

    wp_localize_script( 'dynamic-maths-addition-js', 'php_data', array(
        'user_addition_skill' => get_user_meta( wp_get_current_user()->ID, 'addition-skill-level', true ),
        'ajaxurl' => admin_url( 'admin-ajax.php' )
    ));

}

if (shortcode_exists( 'addition_quiz' ) ){
    add_action( 'wp_enqueue_scripts', 'addition_js_script', 100 );
    add_action( 'wp_enqueue_scripts', 'addition_css_script', 100 );
}

那么,另外.js:

jQuery(document).ready(function($){
  let numTest = '75';

jQuery.ajax({
  url: php_data.ajaxurl,
  data: {
    'action': 'php_test',
    'php_test': numTest
  },
  success: function(data){
    console.log('happy');
  }
});

});

然后在我的后端 menu.php 文件中:

function retrieve_test_number(){
    if (isset($_REQUEST)){
        
         $num = $_REQUEST['php_test'];

        echo 'This is our JS variable: ' . $num;
    }
    die();
}

add_action('wp_ajax_php_test_num', 'retrieve_test_number');

像这样,它显示“这是我们的 JS 变量:”但没有显示数字。

甚至当我尝试使用变量 $num 返回这个函数时,我尝试在一个

中回显它

标记在页面下方,我无法显示要显示的变量。请原谅我的无知,我的php技术很糟糕。

【问题讨论】:

    标签: php jquery ajax wordpress wordpress-plugin-creation


    【解决方案1】:

    将add_action('wp_ajax_php_test_num', 'retrieve_test_number'); 更改为add_action('wp_ajax_php_test', 'retrieve_test_number');。检查下面的代码。

    HTML

    <p id="num"></p>
    

    Javascript

    jQuery(document).ready(function($){
        let numTest = '75';
        jQuery.ajax({
            url: php_data.ajaxurl,
            data: {
                'action': 'php_test',
                'php_test': numTest
            },
            success: function(data){
                console.log('happy');
                $('#num').html(data);
            }
        });
    });
            
    

    PHP

    function retrieve_test_number(){
        if (isset($_REQUEST)){
            $num = $_REQUEST['php_test'];
            echo 'This is our JS variable: ' . $num;
        }
        die();
    }
    add_action('wp_ajax_php_test', 'retrieve_test_number');
    add_action( 'wp_ajax_nopriv_php_test', 'retrieve_test_number' );
    

    经过测试并且有效。

    【讨论】:

    • 好的,但是如何在 html 段落中使用 $num 变量?我试过将它保存到一个变量或在函数中使用 return ,它仍然不会打印 $num 的值
    • 还是不行。前端和 wp-admin 发生了一些事情。当我在 wp-admin 中时,console.log('happy') 不会显示,只有当我在网站的主页上时才会显示。
    • 因为你使用wp_enqueue_scripts,它只适用于前端。您需要使用admin_enqueue_scripts 进行管理
    • 我收到 400 响应。我真的无法弄清楚我做错了什么
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-11-17
    • 1970-01-01
    • 2018-07-26
    • 2017-08-13
    • 2013-12-16
    • 2023-03-17
    • 2013-05-25
    相关资源
    最近更新 更多