1

在我的插件中，我有一些 jQuery-Ajax 代码来处理表单数据，并在单击按钮后立即将其添加到数据库中。由于许多人的插件文件夹路径不同，我想知道是否有标准化指向数据处理 PHP 文件的 URL。请参阅下面的示例：

$.ajax({
   type: "POST",
   url: "url_to_php_file_path.php",
   data: data,
   cache: false,
   success: function() {
      alert.("added");
   }
});
4

2 回答 2

12

找出目标 URL

在 WordPress 中，所有 AJAX 请求都必须发送到以下 URL：

http://www.example.com/wp-admin/admin-ajax.php

您不应直接向位于插件或主题目录中的文件发出 AJAX 请求。

另外，不要对上面的 URL 进行硬编码，而是应该使用以下函数来构造 URL：

<script>
    ajax_url = "<?php echo admin_url('admin-ajax.php'); ?>";
</script>

或者，您可以使用wp_localize_script()，但这不是必需的，上面也可以。

注意：不要担心“管理员”部分，此 URL 对所有用户（包括未登录（访客）用户）都是正确的。

告诉 WordPress 使用什么函数来处理你的 AJAX 请求

您需要让 WordPress 知道哪个函数应该处理您的 AJAX 请求。

为此，您将创建一个自定义函数，并使用wp_ajax_*andwp_ajax_nopriv_*钩子注册它：

add_action('wp_ajax_mycustomfunc', 'mycustomfunc'); // Logged-in users
add_action('wp_ajax_nopriv_mycustomfunc', 'mycustomfunc'); // Guest users
function mycustomfunc() {

    $whatever = esc_html($_POST['whatever']);
    echo 'It works: '.$whatever;
    exit; // This is required to end AJAX requests properly.
}

不要忘记在 AJAX 请求中指定“mycustomfunc”

最后，这是您如何发出正确的 AJAX 请求：

(function ($) {
    $(document).ready(function () {

        var my_data = {
            action: 'mycustomfunc', // This is required so WordPress knows which func to use
            whatever: "yes it is" // Post any variables you want here
        };

        jQuery.post(ajax_url, my_data, function(response) {
            alert('Got this from the server: ' + response);
        });
    });
})(jQuery);

结合这一切

如果您必须将它们全部放入一个文件中，请按照以下步骤操作：

// Register my custom function for AJAX processing
add_action('wp_ajax_mycustomfunc', 'mycustomfunc'); // Logged-in users
add_action('wp_ajax_nopriv_mycustomfunc', 'mycustomfunc'); // Guest users
function mycustomfunc() {

    $whatever = esc_html($_POST['whatever']);
    echo 'It works: '.$whatever;
    exit; // This is required to end AJAX requests properly.
}


// Inline JavaScript
add_action('wp_footer', 'my_inline_js');
function my_inline_js() { ?>

    <script>
        // Set the "ajax_url" variable available globally
        ajax_url = "<?php echo admin_url('admin-ajax.php'); ?>";

        // Make your AJAX request on document ready:
        (function ($) {
            $(document).ready(function () {

                var my_data = {
                    action: 'mycustomfunc', // This is required so WordPress knows which func to use
                    whatever: "yes it is" // Post any variables you want here
                };

                $.post(ajax_url, my_data, function(response) { // This will make an AJAX request upon page load
                    alert('Got this from the server: ' + response);
                });
            });
        })(jQuery);
    </script>

    <?php
}

注意：对于这ajax_url部分，您可以使用wp_localize_script()而不是手动设置它，但它的灵活性较低，因为它需要指定一个您可能没有的现有排队脚本。

注意：另外，为了将内联 JavaScript 手动输出到页面中，使用wp_footer钩子是正确的。如果使用，wp_localize_script()那么您将使用wp_enqueue_scripts钩子代替。

于 2013-08-15T23:18:25.743 回答
2

首先，所有的ajax调用都应该通过wp_ajax

add_action('wp_ajax_add_something', 'add_something');

此代码应与功能一起在您的插件文件中add_something

function add_something(){
    //logic
}

然后在前端，您应该使用ajaxurlWordpress 提供的全局变量。

$.ajax({
    type: 'POST',
    url: ajaxurl,
    data: { 
        action: 'add_something', //this was defined earlier
        data: 'other data here'
    },
    success: function(data){
        //do whatever with the callback
    }
});

这消除了显式声明任何 URL 的需要，因此是在 Wordpress 中执行 ajax 调用的正确方法。

于 2013-08-15T18:39:22.850 回答