jQuery onchange函数在一次选择上，ajax填充二次选择.如何更改回默认值

Question

我有两个select元素。一个用于制造商，一个用于型号。制造商选择元素将通过ajax在更改时更新模型选择元素。我的功能运行良好，但我想添加功能，将型号选择元素更改回其默认值(选择型号…(，并在主制造商选择元素设置回其默认原始值时禁用型号选择(选择制造商…(。

制造商选择(主要(

<select name="inputManufacturer" id="inputManufacturer" class="form-control">
<option selected>Select manufacturer...</option>
<option value="1">Apple</option>
</select>

型号选择(次要，通过ajax更新(

<select name="inputModel" id="inputModel" class="form-control" disabled>
<option>Select model...</option>
</select>

jQuery函数

$(document).ready(function ()
{
$('select[name="inputManufacturer"]').on('change',function(){
$('select[name="inputModel"]').prop('disabled', false);
var man_ID = $(this).val();
if(man_ID)
{
$.ajax({
url : 'add/' +man_ID,
type : "GET",
dataType : "json",
success:function(data)
{
console.log(data);
$('select[name="inputModel"]').empty();
$.each(data, function(key,value){
$('select[name="inputModel"]').append('<option value="'+ key +'">'+ value +'</option>');
});
}
});
}
else
{
$('select[name="inputModel"]').empty();
}
});
});

Answer 1

给出默认选项值="0">

然后可以使用$('select[name="inputModel"]').html('<option value="0">Select model...</option>');而不是空。然后禁用它。

$(document).ready(function ()
{
$('select[name="inputManufacturer"]').on('change',function(){
$('select[name="inputModel"]').prop('disabled', false);
var man_ID = $(this).val();
if(man_ID > 0)
{
$('select[name="inputModel"]').append('<option value="1">Option1</option>');
$('select[name="inputModel"]').append('<option value="2">Option2</option>');
}
else
{
$('select[name="inputModel"]').html('<option value="0">Select model...</option>');
$('select[name="inputModel"]').prop('disabled', true);
}
});
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="inputManufacturer" id="inputManufacturer" class="form-control">
<option value="0" selected>Select manufacturer...</option>
<option value="1">Apple</option>
</select>
<select name="inputModel" id="inputModel" class="form-control" disabled>
<option value="0">Select model...</option>
</select>