我正在尝试在正面创建一个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


,同时在管理员后端的作品。我必须使用什么网址来处理ajax请求?

评论

查看本教程。它可能会帮助您。 1stwebdesigner.com/implement-ajax-wordpress-themes

#1 楼

在后端有一个由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);
        }
    });


评论


我可以使用wp_localize_script而不必使用wp_enqueue_scritp吗?

– dread_cat_pirate
15年6月3日在8:12

您在wp_localize_script中使用脚本句柄,因此必须对至少一个脚本使用wp_enqueue_script。但是...不使用wp_enqueue_script不是一个好主意(您可能会遇到一些冲突和依赖问题)。

– KrzysiekDróżdż♦
2015年6月5日下午6:04

我没有要加载的任何外部脚本,我只想使用ajaxurl进行ajax调用。那不可能吗?

– R T
2015年9月23日下午7:05

您将把这个AJAX呼叫放在哪里?作为内联脚本?这是一个非常糟糕的主意...

– KrzysiekDróżdż♦
2015年9月23日下午7:07

我有一个单独的表单,因为我要管理验证并在提交时进行ajax调用,当然要通过添加钩子以wordpress方式提交表单。无论如何,我已经找到了使用ajaxurl的方法。

– R T
2015年9月23日在7:25

#2 楼

要直接使用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与默认用法类似。这比公认的答案要好得多。

–阿贝尔·梅尔奎德斯·卡雷霍
18/12/25在4:01

是的,但是如果您在.js文件中使用它,则没有用。

–法律
19年3月20日在7:56

@Jules ajaxurl在* .js文件中仍然可用。为此,您可能需要在页面加载的早期声明ajaxurl变量。要考虑的另一件事是调用您的外部* .js文件。在实例化ajaxurl之后,应将外部文件命名为正确的URL值。

–阿贝尔·梅尔奎德斯·卡雷霍
19年11月9日,0:53

控制台有什么错误?

– Dharmishtha Patel
20年1月29日在7:10

与以相同方式声明变量的其他插件或主题发生冲突该怎么办?我确实认为您至少应在变量的名称空间中使用。无论如何,我认为以后被接受的答案引起麻烦/冲突的可能性较小。但是我想,如果您很清楚自己在做什么,那么这种方法很好。

–法律
20-09-22在14:42

#3 楼

我在wordpress网站中使用了以下代码。

<?php echo esc_url(admin_url('admin-ajax.php')); ?>  


我也添加了ajax示例,我们可以在上面使用。

 function setNotificationRead() {
        fetch('<?php echo esc_url(admin_url('admin-ajax.php')); ?>', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded; charset=utf-8'
            },
            body: `action=yourFunctionsAction`,
            credentials: 'same-origin'
        }).then(response => {
            return response.json();
        }).then(data => {
            if (data.status === 'true') {
                console.log('Do something...');
            }
        });
    }