I know the event name when we change something in a select is change (html: onchange), but I would like to know what is the event name when I select (click) a specific option.

Example :

<select>
    <option>Option 1</option>
</select>

When I click on Option 1, what event happen ? Only change (on the select itself and all option) or something else ?

Thanks.

I know the event name when we change something in a select is change (html: onchange), but I would like to know what is the event name when I select (click) a specific option.

Example :

<select>
    <option>Option 1</option>
</select>

When I click on Option 1, what event happen ? Only change (on the select itself and all option) or something else ?

Thanks.

• javascript
• jquery
• html

• In most browsers change. – mplungjan Commented Jun 5, 2012 at 16:23

4 Answers 4

By default, in most browser happen change event when you change select and click event for option.

$('select').on('change', function(event) {
  console.log(event.type);   // event.type is to get event name
});

'change' on the SELECT and 'click' on the OPTION. Also, in Opera, 'input' might fire on the SELECT too if you add the listener with addEventListener() for example.

event.type returns the nature of event. Refer the Demo

$('select').bind('change', function(event) {
    alert("Event :"+ event.type);   
});

You can use .on/.bind on the element.​

You can put it in the onclick event of the option you are interested in like so:

<select id="MySelect">
    <option id="optionA" onclick="alert('You clicked A')">a</option>
    <option id="optionB">b</option>  
</select>