用js+html5實現二級聯動省份下拉選單
阿新 • • 發佈：2019-01-06
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>二級聯動省份下拉框</title> </head> <body> </body> </html> <script> var provinces = ['請選擇城市','湖北省','湖南省']; var city1 = ['武漢市','荊州市','襄陽市']; var city2 = ['長沙市','岳陽市','湘潭市']; //生成有資料的省的下拉框 document.write("<select name='selPro' onchange='showCity(this)'>"); for(var i = 0;i<provinces.length;i++){ document.write("<option value='"+i+"'>"+provinces[i]+"</option>"); } document.write("</select>"); document.write("<select name='selCity'></select>"); function showCity(obj){ var content = ""; if(obj.value==1){ for(var i = 0;i<city1.length;i++){ content = content + "<option value='"+i+"'>"+city1[i]+"</option>"; } }else{ for(var i = 0;i<city2.length;i++){ content = content + "<option value='"+i+"'>"+city2[i]+"</option>"; } } document.getElementsByName("selCity")[0].innerHTML = content; } </script>