select_event.html [plain text]

<!DOCTYPE html>
<html>
<body>
<div id="message"></div>
<select id="s" autofocus>
<option>1</option>
<option>2</option>
<option>3</option>
</select>
<script>
function handler(e) {
  document.getElementById('message').innerText += "down";
}

function handler2(e) {
  document.getElementById('message').innerText += "click";
}

function handler3(e) {
  document.getElementById('message').innerText += "up";
}

function handler4(e) {
  document.getElementById('message').innerText += "change";
}

document.getElementById('s').addEventListener('mousedown', handler);
document.getElementById('s').addEventListener('click', handler2);
document.getElementById('s').addEventListener('mouseup', handler3);
document.getElementById('s').addEventListener('change', handler4);
</script>
</body>
</html>