您需要采取的第一步是稍微重新组织代码。WordPress允许您通过一个动作wp\\u Ajax注册Ajax调用。这是一种更安全、更简单的方法来创建可以与javascript一起使用的ajax调用。

下面我已经创建了您需要的所有内容。前两个函数将放在主题函数中。php和最后一块将需要放置在自定义文件中。主题根目录中的js文件。

第一个函数调用custom。js并将其排队以加载到主题中。这是WordPress通过加载链向上发送脚本以加载到wp\\u head或wp\\u footer中的方式，具体取决于您的喜好。我们还使用wp\\u localize\\u脚本在javascript中设置一些变量，以便使用ajax。这些存储在clocal中，看起来像这样：clocal。ajaxurl和clocal。暂时的。“nonce”是我们用来再次检查坏人是否试图通过此ajax调用攻击您的站点的安全密钥。

/*
 * File: functions.php
 * This function will enqueue (insert) the script into the WordPress header or footer the proper way, instead of adding it directly to the header.php
 * We use wp_localize_script to inject a javascript object, clocal, into our custom.js to gain access to the variables ajaxurl and nonce.
 *
 * Source:
 * https://developer.wordpress.org/reference/functions/wp_enqueue_script/
 * https://codex.wordpress.org/Function_Reference/wp_localize_script
 * https://codex.wordpress.org/Function_Reference/wp_create_nonce
 */

add_action( \'wp_enqueue_scripts\', \'cortez_enqueue_script\' );
function cortez_enqueue_script() {
    wp_enqueue_script( \'cortez_custom_js\', get_stylesheet_directory_uri() . \'/custom.js\', array( \'jQuery\' ), \'1.0\', true );
    wp_localize_script( \'cortez_custom_js\', \'clocal\', array(
        \'ajaxurl\' => admin_url( \'admin-ajax.php\' ),
        \'nonce\'   => wp_create_nonce( \'cortez_nonce_security_key\' ),
    ) );
}

下一个函数是ajax调用。我们使用两个动作，wp_ajax 和wp_ajax_nopriv 启用ajax操作“cortez\\u get\\u terms”。请注意，该操作正好位于WordPress操作的内部：wp_ajax_cortez_get_terms. 有了这个定义，我们可以在javascript端请求操作“cortez\\u get\\u terms”。

在这个函数的开头，您会注意到wp_verify_nonce. 这是检查我们在前面的函数中创建的安全密钥，以确保它是有效的请求。

/*
 * File: functions.php
 * Add this to your functions.php to enable the ajax call to be called from custom.js. The two actions are required if you want logged in and non-logged in users to be able to use the ajax function.
 *
 * Source:
 * https://codex.wordpress.org/AJAX_in_Plugins
 * https://codex.wordpress.org/Plugin_API/Action_Reference/wp_ajax_(action)
 * https://codex.wordpress.org/Plugin_API/Action_Reference/wp_ajax_nopriv_(action)
 * https://codex.wordpress.org/Function_Reference/wp_verify_nonce
 */
add_action( \'wp_ajax_cortez_get_terms\', \'cortez_get_terms\' );
add_action( \'wp_ajax_nopriv_cortez_get_terms\', \'cortez_get_terms\' );
function cortez_get_terms() {
    $data = esc_sql( $_POST );
    if ( ! wp_verify_nonce( $data[\'nonce\'], \'cortez_nonce_security_key\' ) ) {
        wp_die( \'Security check\' );
    }
    if ( ! isset( $data[\'term_chosen\'] ) || empty( $data[\'term_chosen\'] ) ) {
        wp_die( \'No Term Chosen\' );
    }

    $tipos_bicicletas       = \'tipos_bicicletas\';
    $modelos_bicicletas     = \'modelos_bicicletas\';
    $marcas_bicicletas      = \'marcas_bicicletas\';
    $tax_tipos_bicicletas   = get_terms( $tipos_bicicletas, array( \'hide_empty\' => false ) );
    $tax_modelos_bicicletas = get_terms( $modelos_bicicletas, array( \'hide_empty\' => false ) );
    $tax_marcas_bicicletas  = get_terms( $marcas_bicicletas, array( \'hide_empty\' => false ) );

    $json = json_encode( $tax_tipos_bicicletas );
    if ( $data[\'term_chosen\'] == \'bicicleta\' ) {
        echo $json;
    }


    wp_die(); //stop function once you\'ve echoed (returned) what you need.
}

最后，我们通过定制将一切联系在一起。js。这是一个需要在主题（wp-content/themes/your\\u-theme/custom.js）内创建的文件。创建后，将以下代码加载到其中。这与ajax调用相同，只是它使用了我们在wp\\u localize\\u脚本中设置的变量作为url，这是一个POST请求，而不是GET请求。

请注意，我还传递了一个“data”属性。这是我将发布到WordPress ajax处理程序（admin ajax.php）的一组数据。这必须包括一个“action”节点，它是您的ajax调用，在我们的示例中是cortez\\u get\\u terms。没有这个WordPress不知道该怎么办。

你会看到我路过term_chosen 在该数据属性中也是如此。这是用户选择的下拉列表的选择值。我们将其发送到ajax脚本（在functions.php中的前面函数中），如果您看一下，我们可以使用该变量来双重检查用户的选择并输出正确的数据。

/*
 * Filename: custom.js
 *
 */

jQuery(function ($) {
    $("#opt-categorias").change(function () {
        var opt_categorias = $("#opt-categorias").val();
        $.ajax({
            type: "POST",
            url: clocal.ajaxurl,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            data: {
                \'action\': \'cortez_get_terms\',
                \'nonce\': clocal.nonce,
                \'term_chosen\': opt_categorias,
            },
            success: function (data) {
                $("#opt_tipo").empty();
                $("#opt_tipo").append("<option value=\'\'> Tipo de produto</option>");
                $.each(data, function (i, item) {
                    $("#opt_tipo").append(\'<option value="\' + data[i].slug + \'">\' + data[i].name + \'</option>\');

                });
            },
            error: function(error){
            },
            complete: function () {
            }
        });
    });
});

这是一个快速而肮脏的例子，肯定还有更多的建议，但我认为这应该让你开始。请务必查看我在函数注释中添加的“源”链接，如果您有任何问题，请告诉我。