jquery根据菜单onchange值加载页面元素

jquery根据菜单onchange值加载页面元素,jquery,if-statement,option,onchange,Jquery,If Statement,Option,Onchange,我有两个下拉菜单,我想要这样:当我在名为“ItemCountry”的下拉菜单中选择选项时,div id=“StateFeeder”将根据第一个菜单中的值在另一个页面中加载某个下拉菜单 这是第一个菜单: <label for="ItemCountry">Country <span class="req">*</span></label> <select name="ItemCountry" id="ItemCountry" class="cat

我有两个下拉菜单,我想要这样:当我在名为“ItemCountry”的下拉菜单中选择选项时,div id=“StateFeeder”将根据第一个菜单中的值在另一个页面中加载某个下拉菜单

这是第一个菜单:

<label for="ItemCountry">Country <span class="req">*</span></label>
<select name="ItemCountry" id="ItemCountry" class="cat_dropdown" onblur="StateFeeder()">
    <option value=" ">-- Select Country --</option>
    <option value="AU" selected="selected">Australia</option>
    <option value="CA">Canada</option>
    <option value="CN">China</option>
    <option value="NZ">New Zealand</option>
    <option value="RU">Russia</option>
    <option value="US">United State</option>
</select>
<div id="StateFeeder">
    <div>
        <label for="ItemState">State <span class="req">*</span></label>
        <select name="ItemState" id="ItemState" class="cat_dropdown">
             <option value="">-- Please select --</option>
             <option value="NSW">NSW</option>
             <option value="VIC">VIC</option>
             <option value="QLD">QLD</option>
             <option value="ACT">ACT</option>
             <option value="TAS">TAS</option>
             <option value="WA">WA</option>
             <option value="SA">SA</option>
             <option value="NT">NT</option>
         </select>
         e.g. NSW         
    </div>
</div>
<script type="text/javascript">
    $(function() {
        $('#ItemCountry').change(function() {
            if (document.ItemCountry.selectedIndex == 'AU') {
                $("#StateFeeder").empty().html('<img src="/images/mapCountry /AU/ajaxloader.gif" class="IMG-Loading" />');
                $('#StateFeeder>div').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-AU');
            };
            if (document.ItemCountry.selectedIndex == 'CA') {
                $("#StateFeeder>div").empty().html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
                $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-CA');
            };
            if (document.ItemCountry.selectedIndex == 'CN') {
                $("#StateFeeder").empty().html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
                $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-CN');
            };
            if (document.ItemCountry.selectedIndex == 'NZ') {
                $("#StateFeeder").empty().html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
                $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-NZ');
            };
            if (document.ItemCountry.selectedIndex == 'RU') {
                $("#StateFeeder").empty().html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
                $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-RU');
            };
            if (document.ItemCountry.selectedIndex == 'US') {
                $("#StateFeeder").empty().html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
                $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-US');
            };
        });
    });
</script>
国家*
--选择国家--
澳大利亚
加拿大
中国
新西兰
俄罗斯
美国
这是第二个菜单:

<label for="ItemCountry">Country <span class="req">*</span></label>
<select name="ItemCountry" id="ItemCountry" class="cat_dropdown" onblur="StateFeeder()">
    <option value=" ">-- Select Country --</option>
    <option value="AU" selected="selected">Australia</option>
    <option value="CA">Canada</option>
    <option value="CN">China</option>
    <option value="NZ">New Zealand</option>
    <option value="RU">Russia</option>
    <option value="US">United State</option>
</select>
<div id="StateFeeder">
    <div>
        <label for="ItemState">State <span class="req">*</span></label>
        <select name="ItemState" id="ItemState" class="cat_dropdown">
             <option value="">-- Please select --</option>
             <option value="NSW">NSW</option>
             <option value="VIC">VIC</option>
             <option value="QLD">QLD</option>
             <option value="ACT">ACT</option>
             <option value="TAS">TAS</option>
             <option value="WA">WA</option>
             <option value="SA">SA</option>
             <option value="NT">NT</option>
         </select>
         e.g. NSW         
    </div>
</div>
<script type="text/javascript">
    $(function() {
        $('#ItemCountry').change(function() {
            if (document.ItemCountry.selectedIndex == 'AU') {
                $("#StateFeeder").empty().html('<img src="/images/mapCountry /AU/ajaxloader.gif" class="IMG-Loading" />');
                $('#StateFeeder>div').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-AU');
            };
            if (document.ItemCountry.selectedIndex == 'CA') {
                $("#StateFeeder>div").empty().html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
                $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-CA');
            };
            if (document.ItemCountry.selectedIndex == 'CN') {
                $("#StateFeeder").empty().html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
                $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-CN');
            };
            if (document.ItemCountry.selectedIndex == 'NZ') {
                $("#StateFeeder").empty().html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
                $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-NZ');
            };
            if (document.ItemCountry.selectedIndex == 'RU') {
                $("#StateFeeder").empty().html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
                $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-RU');
            };
            if (document.ItemCountry.selectedIndex == 'US') {
                $("#StateFeeder").empty().html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
                $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-US');
            };
        });
    });
</script>

陈述*
--请选择--
新南威尔士州
维克
昆士兰
表演
助教
华盛顿州
沙特阿拉伯
新界
e、 g.新南威尔士州
我编写的jquery,但它不起作用:

<label for="ItemCountry">Country <span class="req">*</span></label>
<select name="ItemCountry" id="ItemCountry" class="cat_dropdown" onblur="StateFeeder()">
    <option value=" ">-- Select Country --</option>
    <option value="AU" selected="selected">Australia</option>
    <option value="CA">Canada</option>
    <option value="CN">China</option>
    <option value="NZ">New Zealand</option>
    <option value="RU">Russia</option>
    <option value="US">United State</option>
</select>
<div id="StateFeeder">
    <div>
        <label for="ItemState">State <span class="req">*</span></label>
        <select name="ItemState" id="ItemState" class="cat_dropdown">
             <option value="">-- Please select --</option>
             <option value="NSW">NSW</option>
             <option value="VIC">VIC</option>
             <option value="QLD">QLD</option>
             <option value="ACT">ACT</option>
             <option value="TAS">TAS</option>
             <option value="WA">WA</option>
             <option value="SA">SA</option>
             <option value="NT">NT</option>
         </select>
         e.g. NSW         
    </div>
</div>
<script type="text/javascript">
    $(function() {
        $('#ItemCountry').change(function() {
            if (document.ItemCountry.selectedIndex == 'AU') {
                $("#StateFeeder").empty().html('<img src="/images/mapCountry /AU/ajaxloader.gif" class="IMG-Loading" />');
                $('#StateFeeder>div').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-AU');
            };
            if (document.ItemCountry.selectedIndex == 'CA') {
                $("#StateFeeder>div").empty().html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
                $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-CA');
            };
            if (document.ItemCountry.selectedIndex == 'CN') {
                $("#StateFeeder").empty().html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
                $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-CN');
            };
            if (document.ItemCountry.selectedIndex == 'NZ') {
                $("#StateFeeder").empty().html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
                $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-NZ');
            };
            if (document.ItemCountry.selectedIndex == 'RU') {
                $("#StateFeeder").empty().html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
                $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-RU');
            };
            if (document.ItemCountry.selectedIndex == 'US') {
                $("#StateFeeder").empty().html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
                $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-US');
            };
        });
    });
</script>

$(函数(){
$('#ItemCountry')。更改(函数(){
如果(document.ItemCountry.selectedIndex=='AU'){
$(“#StateFeeder”).empty().html(“”);
$('#StateFeeder>div')。加载('/StateFeeder/StateFeeder-Buy.html'#StateFeeder-AU');
};
如果(document.ItemCountry.selectedIndex=='CA'){
$(“#StateFeeder>div”).empty().html(“”);
$('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html#StateFeeder-CA');
};
如果(document.ItemCountry.selectedIndex=='CN'){
$(“#StateFeeder”).empty().html(“”);
$('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html#StateFeeder-CN');
};
如果(document.ItemCountry.selectedIndex=='NZ'){
$(“#StateFeeder”).empty().html(“”);
$('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html#StateFeeder-NZ');
};
如果(document.ItemCountry.selectedIndex=='RU'){
$(“#StateFeeder”).empty().html(“”);
$('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html'#StateFeeder-RU');
};
如果(document.ItemCountry.selectedIndex==“US”){
$(“#StateFeeder”).empty().html(“”);
$('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html#StateFeeder-US');
};
});
});

selectedIndex
返回所选选项的索引,您应该使用
属性:

 $(function() {
     $('#ItemCountry').change(function() {
         var val = this.value; // value of the select element
         $("#StateFeeder").html('<img src="/images/mapCountry/AU/ajax-loader.gif" class="IMG-Loading" />');
         $('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html #StateFeeder-'+val);
     })
  })
$(函数(){
$('#ItemCountry')。更改(函数(){
var val=this.value;//选择元素的值
$(“#StateFeeder”).html(“”);
$('#StateFeeder').load('/StateFeeder/StateFeeder-Buy.html#StateFeeder-'+val);
})
})