简单的jQuery级联选择

Question

我有这样的代码：

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("select#type").attr("disabled","disabled"); 
     $("select#model").attr("disabled","disabled"); 
     $("select#category").change(function(){ 
     $("select#type").attr("disabled","disabled"); 
     $("select#type").html("<option>Please wait...</option>"); 
     var id = $("select#category option:selected").attr('value'); 
     $.post("../select_type.php", {id:id}, function(data){ 
      $("select#type").removeAttr("disabled"); 
      $("select#type").html(data); 
     }); 
    }); 
    $("select#type").change(function(){ 
     $("select#model").attr("disabled","disabled"); 
     $("select#model").html("<option>Please wait...</option>"); 
     var id2 = $("select#type option:selected").attr('value'); 
     $.post("../select_model.php", {id2:id2}, function(data){ 
      $("select#model").removeAttr("disabled"); 
      $("select#model").html(data); 
     }); 
    }); 
    $("form#select_form").submit(function(){ 
     var cat = $("select#category option:selected").attr('value'); 
     var type = $("select#type option:selected").attr('value'); 
     var model = $("select#model option:selected").attr('value'); 
     if(cat>0 && type>0 && model >0) 
     { 
      var model = $("select#model option:selected").html(); 
      var type = $("select#type option:selected").html(); 
      $("#result").html('<br>Your choice: ' + type + ' ' + model + '.'); 
     } 
     else 
     { 
      $("#result").html("<br>You have to fill every field!"); 
     } 
     return false; 
    }); 
}); 

这是一个3级级联下拉菜单系统，获取从数据库DATAS用PHP。我的问题是，无论何时达到第三级（大洲 - >国家 - >城市），并且我将该大陆改为其他或“未选定”，其他两个级别将不会重置。当大陆选择输入没有选择任何值时，它们应该处于非活动状态并重新设置。我怎么能解决这个问题？

Answer 1

$("select#category").change()禁用/清空#model以及在执行ajax请求并启用#type选择之前检查选定的值。