Josh Warts
Josh Warts

Reputation: 41

jQuery: Event binding

I have a select with size 4, problem is that I can click on any option, and without releasing the mouse button, just moving the cursor up or bottom, I can select other options. How to bind this event with jQuery? .change() event works exactly.

Html code

<select name="test" size="4">
<option value="1">value 1</option>
<option value="2">value 2</option>
<option value="3">value 3</option>
<option value="4">value 4</option>
</select>

jQuery code

$('select[name="test"] option').each(function(){
     $(this).on("click",
       function() {
          //do
       });
});

Upvotes: 0

Views: 112

Answers (3)

avall
avall

Reputation: 2055

You shouldn't handle event on <option> tag. If you handle change event on <select> tag the jquery event handler works correctly.

Example: http://jsfiddle.net/avall/YyHAD/4/

Upvotes: 1

Peer
Peer

Reputation: 36

You can use change() on the select:

$('select[name="test"]').change(function(){
    alert($(this).val());
});

See http://jsfiddle.net/xKDM6/

Upvotes: 0

TRR
TRR

Reputation: 1643

Check the mousedown event in Jquery. This link might be helpful.

Upvotes: 0

Related Questions