HTML Select change event fires on scroll bar click in Chrome when select tag has a size attribute

Question

I have a simple select box with a size attribute and I want to call a function when its value changes.
So I add an onchange event to the select tag:

<select onchange="alert(this.options[this.selectedIndex].value);" size="6" id="selecttest">
  <option value = "1">1</option>
  <option value = "2" selected>2</option>
  <option value = "3">3</option>
  <option value = "4">4</option>
  <option value = "5">5</option>
  <option value = "6">6</option>
  <option value = "7">7</option>
  <option value = "8">8</option>
  <option value = "9">9</option>
  <option value = "10">10</option>
  <option value = "11">11</option>
  <option value = "12">12</option>
</select>

See http://jsfiddle.net/MGtJZ/2/.

In Chrome [Version 27.0.1453.94 m] in Windows 7 Pro (not in IE or Firefox from my tests), the onchange event is fired when you simply click in the select box's scroll bar, without the value having changed.

This also happens if I have a jQuery change event registered instead of using pure JavaScript (http://jsfiddle.net/MGtJZ/1/), i.e., I remove the onchange attribute and register the change event handler like so:

$(function () {
  $('#selecttest').change(function () {
    alert($(this).val());
  });
});

Is this what I should be expecting?

Note: This only happens if you click the scroll bar or arrows first. If you click the selected value or another value, then click the scroll bar/arrows, this behavior stops.

Answer 1

This appears to be a known issue with 27.0.1453.94.

• Issue 244406: SELECT box with MULTIPLE option fires ONCHANGE event on scroll
• Issue 16184002: REGRESSION: Select listbox dispatches a change event on scroll. (Closed)