Question

I’m having a problem but I couldn’t solve it.

my code is working on firefox perfectly.

I have two list boxes: the first one contains countries, the second contains cities. If you change country, the cities list in the second list box.

my jquery code:

$('#country').change(function(){

var sec=$('#country').val();

    $.post(
            'select.php?do=country',
            {s:sec},
            function(answer){
                $('#city').html(answer);
            }
    );

});

when I changed country nothing happens in google chrome.

thank you.

Answer 1

Is all of this code wrapped in a $(document).ready() method?

Chrome parses faster than ffox and therefore the binding of the change function could be taking place before the DOM is ready. Without using a DOM ready function, the element with id country might not be rendered by the browser.

$(function() {
// or $(document).ready(function() {
  $('#country').change(function(){

  var sec=$('#country').val();

    $.post(
            'select.php?do=country',
            {s:sec},
            function(answer){
                $('#city').html(answer);
            }
    );

  });

});