📄 7-19.html
字号:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>下拉菜单，通用</title>
<style>
<!--
form{
padding:0px; margin:0px;
font:14px Arial;
}
p{
margin:0px; padding:3px;
}
input{
margin:0px;
border:1px solid #000000;
}
-->
</style>
<script language="javascript">
function getSelectValue(Box){
var oForm = document.forms["myForm1"];
var oSelectBox = oForm.elements[Box]; //根据参数相应的选择下拉菜单
if(oSelectBox.type == "select-one"){ //判断是单选还是多选
var iChoice = oSelectBox.selectedIndex; //获取选中项
alert("单选，您选中了" + oSelectBox.options[iChoice].text);
}else{
var aChoices = new Array();
//遍历整个下拉菜单
for(var i=0;i<oSelectBox.options.length;i++)
if(oSelectBox.options[i].selected) //如果被选中
aChoices.push(oSelectBox.options[i].text); //压入到数组中
alert("多选，您选了：" + aChoices.join()); //输出结果
}
}
</script>
</head>
<body>
<form method="post" name="myForm1">
星座：
<p>
<select id="constellation1" name="constellation1">
<option value="Aries" selected="selected">白羊</option>
<option value="Taurus">金牛</option>
<option value="Gemini">双子</option>
<option value="Cancer">巨蟹</option>
<option value="Leo">狮子</option>
<option value="Virgo">处女</option>
<option value="Libra">天秤</option>
<option value="Scorpio">天蝎</option>
<option value="Sagittarius">射手</option>
<option value="Capricorn">摩羯</option>
<option value="Aquarius">水瓶</option>
<option value="Pisces">双鱼</option>
</select>
<input type="button" onclick="getSelectValue('constellation1')" value="查看选项" />
</p>
<p>
<select id="constellation2" name="constellation2" multiple="multiple" style="height:120px;">
<option value="Aries">白羊</option>
<option value="Taurus">金牛</option>
<option value="Gemini">双子</option>
<option value="Cancer">巨蟹</option>
<option value="Leo">狮子</option>
<option value="Virgo">处女</option>
<option value="Libra">天秤</option>
<option value="Scorpio">天蝎</option>
<option value="Sagittarius">射手</option>
<option value="Capricorn">摩羯</option>
<option value="Aquarius">水瓶</option>
<option value="Pisces">双鱼</option>
</select>
<input type="button" onclick="getSelectValue('constellation2')" value="查看选项" />
</p>
</form>
</body>
</html>⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -