选择省份时,自动显示对应省份的城市
生活随笔
收集整理的這篇文章主要介紹了
选择省份时,自动显示对应省份的城市
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
? 在很多網頁中,都會有讓用戶選擇城市的選項,那么,就需要我們用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.οnlοad=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 οnclick="fun()"></select> ? ? ? ? ? // 定義一個各省份的選擇框 |
| ? | <select></select> ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?//定義一個對應省份所在市的選擇框 |
| ? | </form> |
| ? | </body> |
| ? | </html> |
? ? ? ? 首先用js實現當用戶點擊第一個的時候,對應的選擇框進行城市的跳轉,并清除之前選擇的城市。
? ? 學習js重要的是在堅持,雖然,開始接觸的時候,都覺得挺難的,但要理解實現的功能和每段代碼所要實現的功能。
?
轉載于:https://www.cnblogs.com/liner730/p/4541518.html
總結
以上是生活随笔為你收集整理的选择省份时,自动显示对应省份的城市的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: linux之shell脚本管理(一)
- 下一篇: Android开源库集锦