Frets Frets - 4 months ago 13
jQuery Question

Get clicked option in multiple dropdown

I have a multi select dropdown eg:

<select id="myList" multiple="multiple">
<option value="1">Opt #1</option>
<option value="2" selected="selected">Opt #2</option>
<option value="3" selected="selected">Opt #3</option>
<option value="4">Opt #4</option>
</select>


If I then selects
Opt #4
, how do I then only get
Opt #4
and not
Opt #2
and
Opt #3
? I know I can get all selected options by this:

var selectedOptions = $("#myList option:selected");


However I only want the option I clicked -
Opt #4
. Is this possible?

Edit: note that as I manipulate the list inside a
change
event I can't do it in a
click
event. Also added missing multiple.

Answer

You can get it in the click handler for each option element:

$("#myList option").click(function() {
    var clickedOption = $(this);
});

Update

EDIT: As I manipulate the list inside a change event, I can't do it in a click event.

In that case you need to delegate the event using on. Try this:

$("#myList").on("click", "option", function() {
    var clickedOption = $(this);
});
Comments