Question

I have a SELECT element with the MULTIPLE attribute. When double-clicking on an option in the list, I want to take an action based on the option being clicked.

I understand that the OPTION element doesn’t handle the ondblclick event. If I handle the dblclick event of the SELECT element, is there some way I can identify which option was double-clicked?

<select size="4" name="MySelect" multiple="multiple" ondblclick="myFunction();">
    <option ... />
    ...
</select>

Preferably cross-browser, but IE only would do.

EDIT

I obviously wasn’t clear enough. What I need to do is identify which option was double-clicked from within the event handler (or that the double-click was in an area of the SELECT element without an option). Looking for selectedIndex won’t do as the SELECT element has the MULTIPLE attribute: if the user holds CTRL or SHIFT when double-clicking, more than one item will be selected: I only want the option that was actually double-clicked.

Answer 1

Try this:

document.getElementById('selectID').ondblclick = function(){
    alert(this.selectedIndex);
    // or alert(this.options[this.selectedIndex].value);
};

If you double click on an item, you select it, so you can use this.selectedIndex.