<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> select{ 100px; float: left; margin-right: 10px; } </style> </head> <body> <select name="" id="may01"> <option value="0">请选择省份</option> <option value="四川">四川</option> <option value="云南">云南</option> <option value="贵州">贵州</option> </select> <select name="" id="may02"></select> <select name="" id="may03"></select> <script> var may01 = document.getElementById("may01"); var may02 = document.getElementById("may02"); var may03 = document.getElementById("may03"); may01.onchange=function(){ var val = this.value; if(val=='四川'){ var sichuan=["成都市","绵阳市","乐山市"]; var str="<option value='0'>"+"请选择城市"+"</option>"; for(var i=0;i<sichuan.length;i++){ str+='<option value="'+sichuan[i]+'">'+sichuan[i]+'</option>' } may02.innerHTML=str } }; may02.onchange=function(){ var val=this.value; if(val=="成都市"){ var chengdu=["青羊区","锦江区","武侯区"]; var str="<option value='0'>"+"请选择城市"+"</option>"; for(var i=0;i<chengdu.length;i++){ str+='<option value="'+chengdu[i]+'">'+chengdu[i]+'</option>' } may03.innerHTML=str }else{ may03.innerHTML="" } } </script> </body> </html>