1. 程式人生 > >Js省市二級聯動

Js省市二級聯動

一、javascript 採用二維陣列的方式做了個簡單的省市級二級聯動

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript">

 function changeCity() {
            var citys=new Array();//建立陣列物件
citys['四川省']=['成都市','綿陽市','廣安市'
];//建立個二維陣列 citys['重慶市']=['渝北區','江北區','巴南區']; citys['北京市']=['海淀區','豐臺區','通州區'] var pIndex=document.getElementById('province').value;//獲得省的值 document.getElementById('city').options.length=1;// for(var j in citys[pIndex]){ var newOption1=new Option(citys[pIndex][j],citys[pIndex]);
document.getElementById('city').options.add(newOption1); } } </script> </head> <body> <div> <div> <select name="province" id="province" onchange="changeCity()"> <option>--------請選擇省份-------</option> <option
value="四川省">四川省</option> <option value="重慶市">重慶市</option> <option value="北京市">北京市</option> </select> <select name="city" id="city"> <option>--------請選擇市或者區-------</option> </select> </div> </div> </body> </html>