2014-04-22 47 views
0

我正在尝试使级联下拉在哪些国家应该根据国家过滤,我正在尝试很多代码没有什么与我的网站一起工作,我使用的代码之一是正确的工作,当我用它作为一个单独的演示测试代码根据我的要求给结果,但是当我在我的项目中使用相同的代码与它不工作。为什么不工作在我的网站这个JavaScript?

我的脚本代码如下:

<script type="text/javascript"> 
    var country = new Array('United State','Indonesia','Thailand','Australia','Germany','Japan'); 
    var state = new Array(); 
    state["United State"] = new Array("qw", "we", "er", "rt"); 
    state["Indonesia"] = new Array("as", "sd", "df"); 
    function resetForm(theForm) { 
     /* reset country */ 
     theForm.country.options[0] = new Option("Please select a country", ""); 
     for (var i=0; i<country.length; i++) { 
     theForm.country.options[i+1] = new Option(country[i], country[i]); 
     } 
     theForm.country.options[0].selected = true; 
     /* reset state */ 
     theForm.state.options[0] = new Option("Please select a state", ""); 
     theForm.state.options[0].selected = true; 
    } 
    function updatestate(theForm) { 
     var make = theForm.country.options[theForm.country.options.selectedIndex].value; 
     var newstate = state[make]; 
     theForm.state.options.length = 0; 
     theForm.state.options[0] = new Option("Please select a state", ""); 
     for (var i=0; i<newstate.length; i++) { 
      theForm.state.options[i+1] = new Option(newstate[i], newstate[i]); 
     } 
     theForm.state.options[0].selected = true; 
    } 
</script> 

而我的HTML代码也低于:

<form method="get" name="autoSelectForm"> 
    <div class="control-group"> 
     <label>COUNTRY<span style="font-size:13px;font-weight:normal;display:none;">(Max.2)</span></label> 
     <select name="country" size="2" style="width:100%; height:25px;" class="choseninput" id="filCountry" onchange="updatestate(this.form)"></select> 
    </div> 
    <div class="control-group"> 
     <label>STATE <span style="font-size:13px;font-weight:normal;display:none;">(Max.2)</span></label> 
     <select name="state" style="width:100%; height:25px;" class="choseninput" id="filState"></select> 
    </div> 
<form> 
+0

你能否澄清 “不工作”?它会在控制台中抛出错误吗? – jshanley

+0

没有,没有什么错误,在下拉菜单中显示,但counrty列表美是不是在下拉 – poonam

回答

0

你在你的Array对美国国家的额外空间。首先,你需要纠正一个

//var country = new Array('United  State','Indonesia','Thailand','Australia','Germany','Japan'); 
var country = new Array('United State','Indonesia','Thailand','Australia','Germany','Japan'); 

而你需要做的是在代码中填充状态options之前,你需要检查的状态在state阵列选定的country定义。因为你将它们定义为键,如state["United State"]state["Indonesia"],您可以使用.hasOwnProperty()的方法来检查,如果所选择的国家state数组作为key存在与否。

if (!state.hasOwnProperty(make)) return; 

FIDDLE

+0

显示我试过,但同样的问题又来了,没有状态的显示,我不明白为什么不能在我的特定的项目工作,效果很好在其他分区文件中。 – poonam

+0

我猜你的问题是'js'代码位置。您需要在**相关的'html'之后放置'js'代码**。 –

+0

我已经试过这个,但没有解决方案,是否有任何js冲突的问题,因为在这个项目中使用了许多其他脚本 – poonam

相关问题