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 輔助翻譯的英文資料結果。如果您對結果不滿意，可以加入我們改善翻譯效果：薇曉朵技術論壇。