下拉列表框處理操作主要使用的是一個onchange的事件,此事件描述的是內容改變后行為。
范例:觀察下拉列表框的事件處理
代碼:

<!doctype html>
<html lang = "zh-CN">
<head>
<meta charset="utf-8">
<meta name="description" content="this is a checkbox example">
<meta name="keywords" content="checkbox,html,js">
<title>下拉框的測試</title>
<script type="text/javascript">
window.onload = function () {
document.getElementById('city').addEventListener('change',function(){
alert("當前選項是:"+this.value);
},false);
}
</script>
</head>
<body>
<form action="">
請選擇城市:
<select id = "city">
<option value="BJ - 北京">北京</option>
<option value="SH - 上海">上海</option>
<option value="NJ - 南京">南京</option>
<option value="TJ - 天津">天津</option>
<option value="HF - 合肥">合肥</option>
<option value="WH - 武漢">武漢</option>
</select>
</form>
</body>
</html>
效果圖如下:
默認狀態:

隨意選擇一個城市時:

選擇成功后的結果:

