Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to identify double click in SELECT element with multiple

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.

like image 665
Joe Avatar asked Feb 21 '10 13:02

Joe


1 Answers

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.

like image 135
Harmen Avatar answered Oct 05 '22 10:10

Harmen