Does the HTML "select" element have an on select event? what exactly is the name of the event?
Asked
Active
Viewed 5.1k times
4 Answers
25
It's also worth mentioning that this doesn't fire if the selection doesn't change (seems self explanatory). As far as I know there is no event that fires when a user drops down the selectbox and then reselects the original value.
-
@wakeless thanks, I knew the search on Google for this one edge case was going to be tough. Glad you piped up to cover the question of the user selecting the same value. – Sukima Apr 15 '15 at 12:33
20
It's onchange Event.
jQuery wraps it in the .change helper. If using plain Javascript then use addEventListner('change', function...):
<html>
<head>
<script type="text/javascript" src="jquery-1.2.6.js"></script>
<script type="text/javascript">
// If using jQuery
$(document).ready( function() {
$("#list").attr( "selectedIndex", -1 );
$("#list").change( function() {
$("#answer").text( $("#list option:selected").val() );
});
});
</script>
<script type="text/javascript">
// Plain Javascript:
document.addEventListener('DOMContentLoaded', function(event) {
var selectList = document.getElementById("list");
var divAnswer = document.getElementById("answer");
selectList.addEventListener("change", function(changeEvent) {
divAnswer.textContent = selectList.value;
});
});
</script>
</head>
<body>
<div id="answer">No answer</div>
<form>
Answer
<select id="list">
<option value="Answer A">A</option>
<option value="Answer B">B</option>
<option value="Answer C">C</option>
</select>
</form>
</body>
</html>
Dai
- 141,631
- 28
- 261
- 374
Alexander Prokofyev
- 33,874
- 33
- 95
- 118
-
15The world is not jQuery. Probably best to respond with a generic JS response if the O.P. didn't explicitly ask for jQuery. – Jeremy Visser Dec 12 '09 at 00:11
3
Regardless of input type, whenever a form input changes value, an onchange event should always be thrown. (With the exception of buttons, as they are not really input devices as such.)
Ryan McCue
- 1,628
- 14
- 23