老师,帮忙看下这样写可以吗?有没有要改进的地方~

来源:7-8 编程练习

加油啊豪

2020-07-05 14:54:46

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>practice</title>

<script type="text/javascript" src="practice.js"></script>

</head>

<body onload="shengqu()">

<form>

省份:<select id="sheng" onchange="selectShengQu()"></select>

市/区:<select id="qu"></select>

</form>

</body>

</html>




function shengqu(){

var sheng=document.getElementById("sheng");

var qu=document.getElementById("qu");

var arraySheng=["北京市","天津市","河北省","河南省"];

var arrayQu=["朝阳区","西城区","西青区","武清区","石家庄","邯郸市","郑州市","开封市"];

initShengQu(sheng,0,arraySheng,arraySheng.length);

initShengQu(qu,0,arrayQu,arrayQu.length);

}


function initShengQu(obj,start,array,end){

for(var i=start;i<end;i++){

obj.options.add(new Option(array[i],i));

}

}


function selectShengQu(){

var sheng=document.getElementById("sheng");

var qu=document.getElementById("qu");

var arrayQu=["朝阳区","西城区","西青区","武清区","石家庄","邯郸市","郑州市","开封市"];

var n=parseInt(sheng.value);

var start,end;

switch (n) {

case 0://北京市

start=0;

end=2;

break;

case 1://天津市

start=2;

end=4;

break;

case 2://河北省

start=4;

end=6;

break;

case 3://河南省

start=6;

end=8;

break;

default:

// statements_def

break;

}

qu.options.length=0;

initShengQu(qu,start,arrayQu,end);


}


写回答

1回答

好帮手慕阿园

2020-07-05

同学你好,同学的代码整体完成不错,但是还有个小建议,在一级菜单为北京市时,再点击北京市,显示不出来内容,因为onchange事件表示内容发生改变的时候会触发该事件,所以直到点击一次别的省才会调用到selectShengQu()方法
可以添加onload事件中添加selectShengQu()方法, 当加载页面完就加载selectShengQu()方法。保证页面加载完就可以获取到省份的值,来进行二级联动的判断。

http://img.mukewang.com/climg/5f0186fa09aaa9b103550079.jpg

如果我的回答解决了你的疑惑,请采纳,祝学习愉快~


0

0 学习 · 9666 问题

查看课程