My Javascript code doesn't work in chrome

Question

I write ajax on my page, to get subcategories in select option, depending on categories option list click. In all browsers it works good, i can see my request, response in browsers console... but in chrome functions even doesn`t call. Dou you know, in what the problem is? Here is my code:

    <td>
      <span style="color: #898989;">Main categories</span>
      <br />
      <select style="width: 200px;">
        <?foreach ($main_categories as $item){?>
        <option onclick="get_sub_cat(<?=$item['id']?>,2);return false;" value="<?=$item['id']?>"><?=$item['title']?></option>
        <?}?>
      </select> 
    </td>
    <td>
      <span style="color: #898989;">Subcategories</span>
      <br />
      <select  name="sub_cat" style="width: 200px;" id="prod_subcat_2">
      </select> 
    </td>


function get_sub_cat(id, select_id){
$.ajax({
   type: "POST",
   url: "<?=base_url()?>admin/product/get_sub_cat/"+id,
   data: "",
   success:function (option_list) {
     $("#prod_subcat_"+select_id).children().remove();
     $('#prod_subcat_'+select_id).append(option_list);
   }
 });
}

Answer 1

An <option> elements onclick is not universally supported, instead use an event of the parent <select>

$('#theselect').change(function() {
   alert( $(this).val() );
});​

Answer 2

1) If you run on local folder and not running on server, then chrome have security reasons not to run these type of javascript calls. There is multiple threads around stack overflow about running localy javascript ajax calls on chrome if thats the case.

2) Try your javascript with simple alert("hey"); to check if javascript is working or its the ajax.

3) If javascript works. Use google "Developer tools" ctrl+shift+i, set breakpoint on your javascript call and check what get passed as variable and wheres the problem.

4) If javascript dont work try this http://support.google.com/chrome/bin/answer.py?hl=en&answer=114662