Put an event handler on the select
element instead of option
, and it will work in all browsers. Use the change
and keyup
events:
$('#page').on( 'change keyup', function() {
var selected = this.value;
if( selected == 'about' )
alert( 'About!' );
});
Updated fiddle
Why both the change
and keyup
events? The change
event handles mouse interaction, and the keyup
makes the selector respond when you use the arrow keys or other keys to navigate up and down in the selector.
Alternatively, you can leave out keyup
and only listen for the change
event. Then if you open the selector and use the cursor keys to navigate up and down, nothing will happen until you hit Enter. That will fire a change
event.
In many cases it's more helpful to give immediate feedback to the user while navigating up and down through the list with the keyboard, and listening to change keyup
does that.
Why change
instead of click
? You could use either, but the click
event fires on any click, even if the value hasn't actually changed. OTOH, you may want the event to fire even if the user just clicks on the already-selected option, so in that case the click
event would be better.
Actually, after testing it a bit more, there's a bit more to the click
vs. change
question. Normal mouse interaction with a select list allows for two slightly different ways of using it:
Press the mouse on the selector, keep it pressed down, roll it over an option, and finally release it.
Press the mouse on the selector and release it. The selector opens to show the options. Roll the mouse over the options (the button is not down at this time), and finally click the button on an option.
If you listen for the click
event instead of change
, then in case #2 the event fires twice, on the initial click and on the final click that selects an option. So you could use click
or change
depending on whether you want both clicks or just the final option selection.
I have to add that I haven't tested click
thoroughly here, but I have tested change
and change keyup
very thoroughly, so I trust those more.