不得不在选择字段上单击两次以填充另一个选择字段

Question

我正在使用下面的代码，以便能够在选择相应的国家/地区时为状态/区域填充另一个选择字段。但是，为了获得第二个选择字段的填充，我必须单击第一个选择字段两次。

我知道这是一个简单解决方案的常见问题，然而许多解决方案并不能帮助我回答出错的地方。任何人都可以指出如何解决这个问题？

$("#country").on('click',function() { 
     var country = $('#country').val(); 
     var dataString = 'country='+ country; 
     if(country){ 
      $.ajax({ 
       type: "POST", 
       url: "query.php", 
       data: dataString, 
       cache: true, 
       success: function(html){ 
        $('#stateregion').html('<option value="">Loading...</option>'); 
        $("#stateregion").removeAttr('disabled'); 
        $('#stateregion').html(html); 
        $('#area').html('<option value="">-- Select State/Region First --</option>'); 
       } 
      }); 
     } else { 
        $('#stateregion').html('<option value="">-- Select Country First --</option>'); 
        $("#stateregion").attr('disabled', 'disabled'); 
        $('#area').html('<option value="">-- Select State/Region First --</option>'); 
        $("#area").attr('disabled', 'disabled'); 
     } 
    }); 

Answer 1

是#country a select字段？如果是这样，请使用change事件而不是click。