jquery - Click event is not working on html select option tag in chrome browser -

i want fire click event(not change event) on select option tags. click event on select option tag works in firefox not in google chrome. have spend lot of time resolve issue still not successfull. can me resolve problem. thanx in advance.

try editing onclick function of select tag call option tag's onclick. problem may call twice in firefox.

function getselectedoption(select) {     return select.options[select.selectedindex]; } 

to see in action ->

<select onclick='getselectedoption(this).click()'>   <option onclick='log("foo")' >foo</option>   <option onclick='log("bar")' >bar</option> </select>  <p id="display"></p>  <script>  function log(text) {   document.getelementbyid('display').innerhtml = text; }  function getselectedoption(select) {    return select.options[select.selectedindex]; } </script> 

---

also, problem onclick fired once clicking option , selecting (then firefox comes around another). so, best way found patch change onchange select tag.

but sadly gets rid of initial click, not firefox's correct way of clicking...

---

so, if modify our getselectedoption function check if browser chrome can cover our selves!

var is_chrome = navigator.useragent.tolowercase().indexof('chrome') > -1; 

our new function can following...

clickselectedoption(select) {     if(!is_chrome) return;     select.options[select.selectedindex].click(); } 

---

mix together!

<select onchange='clickselectedoption(this)'>   <option onclick='log("foo")' >foo</option>   <option onclick='log("bar")' >bar</option>  </select>    <p id="display"></p>    <script>    var is_chrome = navigator.useragent.tolowercase().indexof('chrome') > -1;               function log(text) {      document.getelementbyid('display').innerhtml = text;    }      function clickselectedoption(select) {      if(!is_chrome) return;         select.options[select.selectedindex].click();    }  </script>