Chrome: Scroll on <select> triggers change() event

Question

I have a <select> element with the multiple="multiple" attribute. In Chrome (v27), the change() event is getting triggered when the user scrolls by clicking and dragging using the mouse. Once a value has been selected, the problem ceases to exist.

Example Markup

<select multiple="multiple">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
</select>

Example jQuery

$('select').on('change', function() {
  alert('Changed!');
});

Is this a bug with Chrome? I've tried searching but haven't come across anything.

Here's a fiddle

Chitkara

I can't replicate it in Chrome (also v27) – Hasten

@Zenith really? I'm using v27.0.1453.94m (apparently the latest version) and Windows 7 (though I didn't think the OS would be applicable) – Chitkara

@Chitkara I'm exactly the same version and on Windows 7 too :/ weird – Hasten

@Zenith that's very strange indeed :| – Chitkara

@Chitkara i am using Version 27.0.1453.94 m with Windows7 can't replicate either. But seems to be a bug looking at PSR answer. – Garwin

@Zenith I've noticed it only happens when actually clicking the scrollbar to scroll – Chitkara

@Chitkara In that case, I can replicate it :) PSR's answer is correct. – Hasten

@Chitkara maybe 'click keyup' be a replacement for change to prevent that bug, jsFiddle. – Zinkenite

Answer 1

It is the bug in chrome

SELECT box with MULTIPLE option fires ONCHANGE event on scroll

and here

Tonyatonye

It's not just the MULTIPLE option. The SIZE option (with a value greater than 1) also triggers this bug. – Boyfriend