まくまくJavaScriptノート
プルダウンリストから項目を選択したときのイベントをハンドルする (onchange)
下記のサンプルでは、プルダウンリストから項目を選択したときに、その項目の value 属性の値をすぐ下に表示しています。
<select id="sel1">
<option value="apple">Apple is red</option>
<option value="lemon">Lemon is yellow</option>
<option value="peach">Peach is pink</option>
</select>
<p id="message">Message will be shown here</p>
<script>
function handleChange() {
document.getElementById('message').innerHTML = this.value;
}
var sel = document.getElementById('sel1');
sel.onchange = handleChange;
sel.onkeyup = handleChange; // for Firefox
</script>
Message will be shown here
