WordPress 中的 jQuery 帖子答案

【问题标题】：jQuery post in WordPressWordPress 中的 jQuery 帖子
【发布时间】：2017-07-24 14:16:20
【问题描述】：

我的 WP 主题的 JS 文件夹内的 JS 文件中有以下代码：

jQuery('#tarieven-submit').on('click', function(event) {
    event.preventDefault();

    var dest = jQuery('#destination').val();
    var type = jQuery('input[name=taxiType]:checked', '#distance_form').val()

    if (jQuery.trim(dest) != '' && type != '') {
        jQuery.post('../HTA/wp-content/themes/HTA/ajax/tarieven.php', { destination: dest, type: type}, function(data) {
            jQuery('#result').text(data);
        });
    }
});

即使发布到的文件位于正确的文件夹中，我也无法使其正常工作。我猜这与错误的 AJAX 调用有关。但我似乎无法找到如何正确地做到这一点。例如，我看到我需要在 admin-ajax.php 中进行 AJAX 调用，但是，如何在其中添加我的自定义代码？

【问题讨论】：

见here
你看到你的浏览器控制台了吗？你看过php的错误日志吗？
在此处发布您的网站网址，我们会尽力为您提供帮助。

标签： jquery ajax wordpress

【解决方案1】：

您应该尝试使用 WordPress 标准进行 AJAX 调用，要创建 AJAX 调用，您只需在 functions.php 文件中添加将处理您的调用的 PHP 函数，例如，

function ajax_handler() {
    // Do your stuff here;

    wp_die(); // Always put this at the end, it is required by WordPress to end your call.
}

然后你用这个注册你的 AJAX 操作。

add_action( 'wp_ajax_ajax_handler', 'ajax_handler' );
add_action( 'wp_ajax_nopriv_ajax_handler', 'ajax_handler' ); // This is for unlogged users.

所以，你的 jQuery 函数应该是这样的：

var ajaxurl = '<?php echo admin_url('admin-ajax.php'); ?>'; // This is the WordPress AJAX handler file.

jQuery('#tarieven-submit').on('click', function(event) {
event.preventDefault();
var dest = jQuery('#destination').val();
var type = jQuery('input[name=taxiType]:checked', '#distance_form').val()
if (jQuery.trim(dest) != '' && type != '') {
    jQuery.post(ajaxurl, { destination: dest, type: type, action: "ajax_handler"}, function(data) {
        jQuery('#result').text(data);
    });
}

注意我们发送到 WordPress AJAX 处理程序文件 (admin-ajax.php) 的 action 参数。需要告诉 WordPress 在我们的调用中应该执行哪个函数/动作。

【讨论】：