老师 检查下呢
来源：4-3 编程练习
Rain_2020
2020-03-18 01:52:12
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<p>
请选择菜单：
<select id="menu">
<option>请选择</option>
<option value="fruit">水果</option>
<option value="cake">蛋糕</option>
<option value="nuts">坚果</option>
</select>
</p>
<p>该系列有：<span>1515</span></p>
<script>
// 此处写代码
var selectMenu = document.querySelector('#menu');
var opti = selectMenu.querySelectorAll('option');
var spanVal = document.querySelector('span');
selectMenu.onchange = function(){
// console.log(selectMenu.value);
switch(selectMenu.value){
case 'fruit':
fruits();
break;
case 'cake':
cakes();
break;
case 'nuts':
nutss();
break;
}
}
function fruits(){
spanVal.innerHTML = '<span>苹果、香蕉、橙子、西瓜</span>';
}
function cakes(){
spanVal.innerHTML = '<span>奶油、海绵、奶酪、戚风</span>';
}
function nutss(){
spanVal.innerHTML = '<span>开心果、夏威夷果、坚果</span>';
}
</script>
</body>
</html>
1回答
-
同学你好，实现效果是不错的。建议添加一个default默认值，点击‘请选择’的时候也可以改变，如下
祝学习愉快！
1
相似问题