为什么在从下拉菜单选择PHP和Ajax之前会出现0

我有两个下拉框，当您从第一个下拉框中选择主类别时，第二个下拉框将加载子类别供用户选择

但是，从第一个类别下拉列表中选择时，第二个类别下方会显示0

然后，当您选择类别时，将显示0

有人能帮我解释一下为什么会发生这种情况吗？这是我的代码

    if ( ! class_exists( 'frontendAjaxDropdown' ) ):
     class frontendAjaxDropdown
     {
     /**
     * Loading WordPress hooks
     */
     function __construct()
     {
     /**
     * Add shortcode function
     */
     add_shortcode( 'ajax-dropdown', array($this, 'init_shortocde') );
     /**
     * Register ajax action
     */
     add_action( 'wp_ajax_get_subcat', array($this, 'getSubCat') );
     /**
     * Register ajax action for non loged in user
     */
     add_action('wp_ajax_nopriv_get_subcat', array($this, 'getSubCat') );
    
     }
     
     function init_shortocde()
     {
     $parent_id = 420;
    $args = array(
            'hierarchical' => 1,
            'show_option_none' => '',
            'hide_empty' => 0, // Set to 0 to show empty categories and 1 to hide them
            'parent' => $parent_id,
            'taxonomy' => 'location'
        );
        $subcategories = get_categories($args);
            echo '<select name="main_cat" id="main_cat" class="postform"><option value="">Category...</option>';
                ;
        foreach ($subcategories as $category) {
                echo '<option value="' . $category->term_id . '">' . $category->name . '</option>'; // ID of the category as the value of an option
        }
                echo '</select>';
    
     ?>
     <script type="text/javascript">
     (function($){
     $("#main_cat").change(function(){
     $("#sub_cat").empty();
     $.ajax({
     type: "post",
     url: "<?php echo admin_url( 'admin-ajax.php' ); ?>",
     data: { action: 'get_subcat', cat_id: $("#main_cat option:selected").val() },
     beforeSend: function() {$("#loading").fadeIn('slow');},
     success: function(data) {
     $("#loading").fadeOut('slow');
     $("#sub_cat").append(data);
     }
     });
     });
     })(jQuery);
     
     </script>
    
    <div id="loading" style="display: none;">Loading...</div>
     <div id="sub_cat"></div>
     <?php
     }
     
     /**
     * AJAX action: Shows dropdown for selected parent
     */
     function getSubCat()
     {
         
         
          $parent_id = $_POST['cat_id'];
    $args = array(
            'hierarchical' => 1,
            'show_option_none' => '',
            'hide_empty' => 1, // Set to 0 to show empty categories and 1 to hide them
            'parent' => $parent_id,
            'taxonomy' => 'location'
        );
        $subcategories = get_categories($args);
            echo '<select name="sub_cat" id="sub_cat" class="postform"><option value="">Category...</option>';
        
        foreach ($subcategories as $category) {
                echo '<option value="' . $category->term_id . '">' . $category->name . '</option>'; // ID of the category as the value of an option
        }
                echo '</select>';
    
    
     }
   }
    endif;
    new frontendAjaxDropdown();

---

在函数getSubCat的末尾，添加以下内容

wp_die();
Or 
die();

---

这将解决问题。

在函数getSubCat的末尾添加以下内容

wp_die();
Or 
die();

---

这将解决问题。

检查浏览器的“网络”选项卡中的0是否为wp_die或exit或DitHank对您的ajax脚本的实际响应检查浏览器的“网络”选项卡中的0是否为wp_die或exit或DitHank对您的ajax脚本的实际响应检查是否为wp_die或exit或DitHank