onclick on option tag not working on IE and chrome

onclick event on option tag will fail on most versions of IE, Safari and Chrome: reference

If you want to trigger an event whenever user select, why not simply use:

<select onclick="check()">
<option>one</option>
<option>two</option>
<option>three</option>

And if you want to do something with the specific option user selected:

<select onclick="if (typeof(this.selectedIndex) != 'undefined') check(this.selectedIndex)">
<option>one</option>
<option>two</option>
<option>three</option>

This way you are guaranteed to call check() if and only if an option is selected.

Edit: As @user422543 pointed out in the comments, this solution will not work in Firefox. I therefore asked another question here: Why does Firefox react differently from Webkit and IE to "click" event on "select" tag?

So far it seems using <select> tag is will not work consistently in all browsers. However, if we simulate a select menu using library such as jQuery UI select menu or Chosen to create a select menu instead of using <select> tag, click event will be fired on <ul> or <li> tag which is consistent in all browsers I tested.

I have another suggestion, it's not 100%, but almost:

<select onchange="valueChanged(this.value); this.selectedindex = -1">
    <option style="display: none"></option>
    <option value="1"> 1 </option>
    <option value="2"> 2 </option>
    <option value="3"> 3 </option>
    <option value="4"> 4 </option>
</select>

This way the event will be triggered even if the user selected the same option twice. The hitch is that IE will display the empty option (it ignores the style attribute), but clicking it will not fire the event, since it always starts out as being selected, and therefore selecting it does not trigger onchange...