Javascript改进了填充select的ajax调用

Javascript improving ajax call for populating select

本文关键字:ajax 调用 select 填充 Javascript      更新时间:2023-09-26

我使用这段代码来获取一些数据并填充一个选择下拉列表。

$.ajax({
    url: 'myurl here',
    method: 'GET',
    success: function(result) {
        $.each(result.main, function(result, value) {
            $('#myselect').append($('<option>').text(value.id).attr('value', value.id));
        });
    }
});

填充select之后,我需要做的是获得select中填充的第一行的值。

我该怎么做?

要执行此操作,可以将select的val()设置为数组中的第一个项。试试这个:

success: function(result) {
    var html = '';
    $.each(result.main, function(result, value) {
        html += '<option value="' + value.id + '">' + value.id + '</option>'
    });
    $('#myselect').append(html).val(result.main[0].id);
}

工作示例

或者,如果要将选择强制为选择中的第一个option,可以将selectedIndex属性设置为0:

$('#myselect').append(html).prop('selectedIndex', 0);

还要注意,我修改了循环,生成了一个只附加到DOM一次的HTML字符串,这比每次迭代修改DOM更快。

更新

我想得到第一个的值,并将其存储在一个变量中,以便稍后使用

在这种情况下,您可以使用result.main[0].id:

var first = result.main[0].id