Selecting option in select field does not trigger ajax script in Google Chrome

Triggering ajax response doesn't work in Google Chrome and Internet Explorer when selecting an option in the field. It does work in all other browsers though.

Here's the html:

<select>
  <option class="showDiv" data-div="0,1,0,mw1,default" data-vars="2136,1|10|1|0" selected="">added</option>
  &l开发者_Python百科t;option class="showDiv" data-div="0,1,0,mw1,default" data-vars="2136,1|10|1|1">title</option>
  </select>

And here's the ajax part:

$('.showDiv').live("click", function () {
    var divs = $(this).attr('data-div');
    var vars = $(this).attr('data-vars');
    divs = divs.split(",");
    $.ajax({
        type: "post",
        url: "crt/run_script.php",
        data: {
            divs: divs,
            vars: vars,
        },
        beforeSend: function () {
            centerWin("loading");
        },
        complete: function () {
            $("#loading").hide("fast");
        },
        success: function (html) {
            $("#mainWin").html('');
            $("#mainWin").html(html);
        }
    });
});

---

Instead of doing that why don't you do on change of the select element?

$('#selectID').change(function(){
   ...
});

---

To get the option that is selected you can just do this:

$('#selectID').change(function(){
   var index = this.selectedIndex;
   var option = $(this.options[index]);
   //rest of the code use `option` instead of `this` in your code
   ...
});