jQuery附加选项以选择并获取所选值

Question

这部分有麻烦。 我有一个用asp.net mvc填充的选择和由jQuery填充的其他2个空选择

<select id="Type" onchange="GetClassification(this.value);">
    @foreach (var item in Type)
    {
      <option value="@item.TypeID">@item.TypeName</option>
    }
</select>

<select id="Classification" onchange="GetDescription(this.value);">
</select>

<select id="Description" onchange="GetDescriptionTips(this.value);">
</select>

因此，根据第一个选择填充第二个，基于第二个选择填充第三个。 第一个填充正确，第二个填充正确，第三个没有在准备好的文档上填充。

   $(document).ready(function () {
      $(function () {
         var type = $("#Type option:selected").val();
         GetClassification(type);
      });
    });

    function GetClassification(typeID) {
        $.ajax({
            type: 'GET',
            url: '/types/Classification',
            data: { typeID: typeID },
            cache: false,
            success: function (data) {
                $('#Classification option').remove();
                $.each(data, function (index, val) {
                    var optionTag = $('<option></option>');
                    $(optionTag).val(val.ClassificationID).text(val.ClassificationName);
                    $('#Classification').append(optionTag);
                });
            }
        });
    var classification = $("#Classification option:selected").val();
    GetDescription(classification);
}

function GetDescription(classificationID) {
    $.ajax({
        type: 'GET',
        url: '/types/Description',
        data: { classificationID: classificationID },
        cache: false,
        success: function (data) {
            $('#Description option').remove();
            $.each(data, function (index, val) {
                var optionTag = $('<option></option>');
                $(optionTag).val(val.DescriptionID).text(val.DescriptionName);
                $('#Description').append(optionTag);
            });
        }
    });
}

加载页面后，如果选择第二个，则会更改第三个权利，但是如果更改第一个，则只会更改第二个权利。 我需要的是在加载时填充第二个和第三个，然后在更改第一个，重新填充第二个和第三个，并在更改第二个时重新填充第三个。

我可以看到它在任何阶段都不会分配所选内容，因此我不确定是否需要分配它。

希望我能解释得很好。

任何帮助将不胜感激。

Answer 1

首先，请尝试遵循此操作。 不要重复自己 ，这是简单的算法：

1.Choose all selects
2.Create only one ajax function and pass params like url, data, etc to it
3.In success function proccess your response from the server
4.find all next selects and clean them up or remove options as u wish

祝好运！

Answer 2

由于您使用的是jQuery，请尝试使用.on('chang', function(){...)事件处理程序。 因为您正在更改DOM，所以on()方法可以检测到更改事件，甚至在文档准备就绪后DOM也已更改。