代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>201731061203+许嘉欣</title>
<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
<style>
select{
border: 1px solid palevioletred;
border-radius: 5px;
}
select:focus{
outline: none;
}
</style>
</head>
<body>
<form name="form1" method="post">
省份：<select name="province" id="province" "changeSelect(this.selectedIndex)"></select>
市区：<select name="city" id="city"></section>
</form>
<script>
var arrpro=["请选择省份","河北省","四川省"];
var arrcit=[["请选择城市"],["石家庄","邯郸","唐山"],["成都","绵阳","德阳"]];
window.init;
function init()
{
var province=document.form1.province;
var city=document.form1.city;
province.length=arrpro.length;
for(var i=0;i<arrpro.length;i++)
{
province.options[i].text=arrpro[i];
province.options[i].value=arrpro[i];
}
var index=0;
province.selectedIndex=index;
city.length=arrcit[index].length;
for(var i=0;i<arrcit[index].length;i++)
{
city.options[i].text=arrcit[index][i];
city.options[i].value=arrcit[index][i];
}
}
function changeSelect(index)
{
var city=document.form1.city;
province.selectedIndex=index;
city.length=arrcit[index].length;
for(var i=0;i<arrcit[index].length;i++)
{
city.options[i].text=arrcit[index][i];
city.options[i].text=arrcit[index][i];
}
}
</script>
</body>
</html>