WordPress ajaxurl 没有在前端定义

问题描述

我正试图在前面创建一个 ajaxform 。我正在使用代码

    jQuery.ajax(
        {
            type: "post",
            dataType: "json",
            url: ajaxurl,
            data: formData,
            success: function(msg){
                console.log(msg);
            }
        });

我收到错误

Uncaught ReferenceError: ajaxurl is not definedworklorAjaxBookForm @
?page_id=2:291onclick @ ?page_id=2:202

而在管理员后台使用类似的代码工作。我需要使用什么 URL 来处理 ajax 请求？

最佳解决方案

在后端有一个由 WordPress 本身定义的全局 ajaxurl 变量。

该变量不是由 WP 在前端创建的。这意味着如果你想在前端使用 AJAX 调用，那么你必须自己定义这个变量。

好的方法是使用 wp_localize_script 。

我们假设您的 AJAX 调用是在 my-ajax-script.js 文件中，然后为这个 JS 文件添加 wp_localize_script，如下所示：

function my_enqueue() {

    wp_enqueue_script( 'ajax-script', get_template_directory_uri() . '/js/my-ajax-script.js', array('jquery') );

    wp_localize_script( 'ajax-script', 'my_ajax_object',
            array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
}
add_action( 'wp_enqueue_scripts', 'my_enqueue' );

本地化 JS 文件后，可以在 JS 文件中使用 my_ajax_object 对象：

jQuery.ajax(
    {
        type: "post",
        dataType: "json",
        url: my_ajax_object.ajax_url,
        data: formData,
        success: function(msg){
            console.log(msg);
        }
    });

次佳解决方案

直接使用 ajaxurl，在你的插件文件中添加：

add_action('wp_head', 'myplugin_ajaxurl');

function myplugin_ajaxurl() {

   echo '<script type="text/javascript">
           var ajaxurl = "' . admin_url('admin-ajax.php') . '";
         </script>';
}

然后可以使用 ajaxurl 进行 ajax 请求。

参考文献

• ajaxurl not defined on front end

注：本文内容整合自 Google/Baidu/Bing 辅助翻译的英文资料结果。如果您对结果不满意，可以加入我们改善翻译效果：薇晓朵技术论坛。