JavaScript下拉菜单

时间:2011-10-03 22:33:35

标签: javascript

我想创建三个Pull Down Menus .....这就是它们的外观。大陆将是第一个下拉菜单,第二个是国家,所以如果从第一个选择非洲,第二个将只有非洲国家。当一个人点击第二个,那就是选择一个国家......比如苏丹,那么第三个下拉将会有苏丹的州/省。

我该怎么做?我想要一些简单而基本的东西?

我将它存储在JavaScript数据类型中...... {“北美”:[美国,加拿大],“非洲”:[“肯尼亚”,“Tunsia”,“Morroco”]}

2 个答案:

答案 0 :(得分:1)

我建议使用jQuery库使数据绑定变得非常简单。假设您的数据类型已定义为您在问题中所述的数据类型,则可以使用包含所有信息的json对象。 I.E.你有{大陆:[国家:[州/省],...],...)然后你要为第一个选择器做的所有事情都是通过获取对象的键来显示大陆。然后,您将使用所选键的值(另一个json字符串)定义的键填充第二个下拉列表。接下来,基于Country子字符串,创建另一个JSON对象,并根据第二个下拉选项再次按键搜索。最后,您将使用位于国家/地区密钥的值填充第三个下拉列表。

基本上你拥有的是一个2层JSON对象,第一层包含Continents作为键值为2的键,其中包含States作为键的状态,以州/省为值。

如果您知道所有数据,则没有理由创建数据对象来保存数据,JSON字符串就足够了。

答案 1 :(得分:0)

以下是我要找的内容。我刚想通了。谢谢James Khoury

            <form id="someform" >
            <select id="sample"  onChange="myfunction(this)"> 
            <option value="1">Option 1</option>
            <option value="2">Option 2</option>
            <option value="3">Option 3</option>
            </select>
            </form>
            <form id="someform" >
            <select id="samp" > 
            <option value="1">Fire Power</option>
            </select>
            </form>
            <script type="text/javascript">
            function myfunction(myObj) {
            var myselect=document.getElementById("samp")
            try{
            myselect.add(new Option("New Last Option", "0"), null) //a
            "sample"
             myselect.add(new Option("New First Option", "1"), myselect.options[0]) 
             }
             catch(e){ //in IE, try the below version instead of add()
             myselect.add(new Option("New Last Option", "0")) 
             myselect.add(new Option("New First Option", "1"), 0) 
             }
             }
             </script>