Jquery 如何基于另一个下拉列表更改下拉列表值

我有一些JSON对象，我正在填充到第一个下拉列表中，作为材料编号。其中一些物料编号有多个位置。我希望能够从第一个下拉列表和第二个下拉列表中选择材料编号，以填充材料编号的位置。例如，当我在第一个下拉列表中选择905-830005时，我需要在第二个下拉列表中显示选项PROD和DISFERITE-PK

JSON://在下面的JQUERY中声明为RfqData

[
 {"material":"900-100049","location":"STERILE-PK"},
 {"material":"900-100050","location":"STERILE-PK"},
 {"material":"900-110005","location":"PROD"},
 {"material":"900-600030","location":"STERILE-PK"},
 {"material":"900-600031","location":"STERILE-PK"},
 {"material":"905-830005","location":"PROD"},
 {"material":"905-830005","location":"STERILE-PK"},
 {"material":"905-830006","location":"PROD"},
 {"material":"905-830006","location":"STERILE-PK"},
 {"material":"905-860008","location":"STERILE-PK"},
 {"material":"905-860009","location":"STERILE-PK"}
]

HTML:

JQUERY://RfqData是上面的JSON字符串

$(document).ready(function () {
        var json = JSON.parse(SysGetElement('RfqData').value);  

        $.each(json, function () {
            $('#selectMaterial').append(
                $("<option></option>").text(this.material)
            );
        });
});

---

抱歉，此代码未完成-我稍后将填写注释抱歉，此代码未完成-我稍后将填写注释

$(document).ready(function () {
        var json = JSON.parse(SysGetElement('RfqData').value);  

        $.each(json, function () {
            $('#selectMaterial').append(
                $("<option></option>").text(this.material)
            );
        });
});

$("#selectMaterial").change( function(){
    var item = "";
    $("#selectLocation").empty();
    $.each(json, function () {
        if ($(this).val() == /*the material on json*/){
            item += '<option value="' + /*your value*/ + '">' + /*your value*/ + '</option>'
        }
    });
    $('#selectMaterial').html(item);
});

$('#selectMaterial').on('change',GetSelectLocation);

function GetSelectLocation() {

    //Here you get the selected materialId of your selectMaterial dropdown.
    var selectedMaterialId = $('#selectMaterial option:selected').val();

    //Now you must have your original list here. And using the above id fetch the list of location and create a location list. 
    var locationList = //fetch location list.
    $('#selectLocation').html("");
    $.each(locationList , function () {
    $('#selectLocation').append(
    $("<option></option>").text(this.location));
}