为什么AJAX $.post不能在wordpress中工作

我一直在试图理解为什么$.post不起作用。我正在尝试进行两次下降..

下拉列表将包含主类别，第二个下拉列表包含第一个下拉列表的子类别。

[MAIN CATEGORY DROP DOWN] [SUB CATEGORY DROP DOWN]

第一个下拉菜单完美无缺，但由于我不知道的某种原因，子类别无法使用 ajax 获取。

add_shortcode( 'custom_query', 'custom_query' );
add_action( 'wp_ajax_custom_query', 'getSubCategory' );
add_action( 'wp_ajax_nopriv_custom_query', 'getSubCategory' );
function custom_query( $cat_id )
{       
    // first dropdown
    $first_dropdown = array( 'show_option_all'    => '','show_option_none'   => 'Select main category','orderby' => 'ID','order' => 'ASC','show_count' => 0,    'hide_empty' => 0, 'exclude' => 0,'echo' => 1,'selected' => 0,'child_of' => $cat_id,'hierarchical' => 1,'name' => 'chained-categories','id' => '','class' => 'postform',    'depth' => 1, 'tab_index' => 0,'taxonomy' => 'category', 'hide_if_empty' => false ); 
    wp_dropdown_categories( $first_dropdown );
    // subcategories empty but will be populated once the first main category is selected
    echo '<div id="chained-subcontainer">
            <select name="chained-subcategories" id="chained-subcategories">
                <option value="">- Select a category first -</option>
            </select>
        </div>';
    // javascript
    echo '  
        <script type="text/javascript">
            (function($)
            {
                var ajaxurl = "../../wp-admin/admin-ajax.php";
                var subdata = { action: "custom_query" };
                $("#chained-categories").change(function()
                {
                    subdata[ "chained_subcat_id" ] = $( this ).val();
                    subdata[ "chained_subcat_name" ] = $("#chained-categories option[value="+ $( this ).val() + "]").text();
                    if( $( this ).val() > 0 )
                    {
                        #this here works once the first cat is picked
                        alert($("#chained-categories option:selected").val());
                        $.post
                        (
                            ajaxurl, 
                            subdata,   
                            function( response )
                            {
                                $( "#chained-subcontainer" ).html( response );
                            }
                        );
                    } else {
                        $( "#chained-subcontainer" ).html( "<select name="chained-subcategories" id="chained-subcategories"><option value="">- Select a category first -</option></select>" );
                    }   
                });
            })(jQuery);
        </script>
    ';
}
function getSubCategory()
{
    $second_dropdown = array('show_option_all' => '', 'show_option_none' => 'Select subcategory','orderby' => 'ID', 'order' => 'ASC', 'show_count'  => 0, 'hide_empty' => 0, 'exclude' => 0, 'echo' => 1, 'selected' => 0, 'child_of' => $_POST[ 'chained_subcat_id' ], 'hierarchical' => 1, 'name'    => 'chained-subcontainer', 'id' => '', 'class'   => 'postform','depth' => 1, 'tab_index' => 0, 'taxonomy' => 'category', 'hide_if_empty' => false ); 
    wp_dropdown_categories( $second_dropdown );
}

$.post部分不起作用，因为我包含一个警报，一旦在第一个下拉列表中选择了任何选项，它就会显示它的值..并且只要不包含代码的$.post部分，它就可以工作。

编辑：所以在大卫的建议之后，我能够检查一些代码，而一切都像预期的那样工作..就ajax工作而言。我有一个小问题..

在这一行代码中，

else {
    $("#chained-subcontainer").html("<select name="chained-subcategories" id="chained-subcategories"><option value="">Select a category first</option></select>");
}  

如果我删除该部分，那么ajax会正确获取数据..我似乎无法理解为什么..这是我从JSHINT得到的" Expected ')' and instead saw 'chained'.