CODEWITHSUNDEEP
javascripthtmljqueryinternet-explorerhtml-select
Josh Bush
Josh Bush

Reputation: 2718

Capture mouse events for HTML option element on IE

For Internet Explorer only it seems that the target (srcElement) of clicks, mousedowns, mouseups, mouseovers, etc. on <select /> elements will not be tied to the <option /> element.

Given the following HTML:

<select id="madness">
   <option value="1">One</option>
   <option value="2">Two</option>
   <option value="2">Three</option>
</select>

and this basic jQuery event handler:

$("#madness").mousedown(function(e){
   alert(e.target.value); //jQuery pushes srcElement into the target for us here
});

The object that is in e.target or e.srcElement is always equal to the <select /> and not the <option />.

I decided to get creative and try to use document.elementFromPoint(e.clientX,e.clientY) and that returns the <select /> element as well.

That brings the question, is there any way to determine the <option /> inside of a <select /> via event arguments,coordinates, or anything else? I'm aware that I can fake this out with a scrollable div of checkboxes. For the purposes of this question, I'd like any solutions which can use the native select element.

Upvotes: 1

Views: 2786

Answers (2)

AnthonyWJones
AnthonyWJones

Reputation: 189457

Put simply there are no solutions that use the native select element.

Upvotes: 2

Willson Haw
Willson Haw

Reputation: 408

You can do:

$("#madness").val()

To get the value of the selected <option />.

Upvotes: 0

Related Questions