Question

考虑以下HTML：

<select class="form-control" id="resourceName"></select>

我使用JSON中的数据填充select：

jQuery.getJSON("/Booking/GetMachine", { 
    TechnologyName: technologyName, 
    EquipmentTypeName: equipmentTypeName 
}, function (machines) {
    var $select = $('#resourceName');
    $('#resourceName').empty(); 
    $.each(machines, function (i, machine) { 
        var option = $('<option>', {
            value: machine.trim()
        }).html(machine.trim()).appendTo($select);
    });
});

一旦人口化，我想设置与变量匹配的下拉列表的选定值。

jQuery("#resourceName").val(resourceName);

但是它没有按预期工作。如果有人检查我是否犯过任何错误，我将非常感激。谢谢你们

Answer 1

如果您在回调函数中设置val()的{{1}}，则在设置select元素后，您的代码应该可以正常工作：

option

这是因为AJAX调用是异步的。这意味着如果您尝试在回调之外设置值，则实际上在请求完成之前设置值，这意味着没有jQuery.getJSON("/Booking/GetMachine", { TechnologyName: technologyName, EquipmentTypeName: equipmentTypeName }, function (machines) { var $select = $('#resourceName'); $('#resourceName').empty(); $.each(machines, function (i, machine) { var option = $('<option>', { value: machine.trim() }).html(machine.trim()).appendTo($select); }); $("#resourceName").val(resourceName); // < set the value here });元素可供选择。

Answer 2

我认为这段代码工作

    jQuery.getJSON("/Booking/GetMachine", { 
        TechnologyName: technologyName, 
        EquipmentTypeName: equipmentTypeName 
    }, function (machines) {
        var $select = $('#resourceName');
        $('#resourceName').empty(); 
        $.each(machines, function (i, machine) { 
            var option = $('<option>', {
                value: machine.trim()
            }).html(machine.trim()).appendTo($select);
        }).promise().done( function(){      $("#resourceName").val(resourceName);// < set the value here } );

    });

以json填充后以编程方式设置下拉列表

2 个答案: