标签:
在很多网页中,都会有让用户选择城市的选项,那么,就需要我们用js来实现,当用户选择了省份,自动选择对应省份的城市。
| <head> | |
| <title></title> | |
| <meta http-equiv="content" content="text/html" charset="utf-8"/> | |
| <script type="text/javascript"> | |
| var citys =[ ]; // 定义一个变量来保存省份和城市 | |
| citys["四川"]=["成都","绵阳"]; | |
| citys["湖南"]=["岳阳","长沙"]; | |
| citys["广东"]=["深圳","广州"]; | |
| var selects; | |
| window.onload=function( ){ | |
| selects = document.forms[0].elements; // 先找到第一个form对象 | |
| for(var a in citys){ | |
| selects[0].add(new Option(a,a),null); | |
| } | |
| fun() | |
| } | |
| function fun(){ | |
| selects[1].length=0; | |
| var option=selects[0].options[selects[0].selectedIndex]; | |
| var city=citys[option.text]; | |
| for(var i=0;i<city.length;i++){ | |
| selects[1].add(new Option(city[i],city[i]),null); | |
| } | |
| } | |
| </script> | |
| </head> | |
| <body> | |
| <form> | |
| <select onclick="fun()"></select> // 定义一个各省份的选择框 | |
| <select></select> //定义一个对应省份所在市的选择框 | |
| </form> | |
| </body> | |
| </html> |
首先用js实现当用户点击第一个的时候,对应的选择框进行城市的跳转,并清除之前选择的城市。
学习js重要的是在坚持,虽然,开始接触的时候,都觉得挺难的,但要理解实现的功能和每段代码所要实现的功能。
标签:
原文地址:http://www.cnblogs.com/liner730/p/4541518.html