如何使用jQuery在选择框选项中显示数据

Question

我想在ajax响应的选择框选项中显示数据。

这是我的查看文件

<select class="form-control" name="vendor" id="vendor_list" required style="width: 159px;">
<option value="">Vendor 1</option>
</select>

这是我的ajax成功功能

success: function(data) {
    $.each(data, function(i, value) {
        console.log(value);
        $('#vendor_list').append('<option value="'+ value.id+'">'+ value.vendor_name +'</option>');
        console.log(value);
    });
}

这是我的ajax响应json数据

[{"vendor_name":"scscss"},{"vendor_name":"xzcdsfdx"}]

如何在选择框中显示值。 给我意见

Answer 1

我认为问题出在

$('#vendor_list').append('<option value="'+ value.id+'">'+ value.vendor_name +'</option>');

如果创建一个选项字符串并在整个data进行迭代之后将其附加会更好一些

由于不可能复制ajax，因此我直接使用了ajax响应

您可以将整个代码放入成功块中，但是不需要var x因为在您的情况下， data将扮演var x=[...]角色

var x = [{"vendor_name":"scscss"},{"vendor_name":"xzcdsfdx"}]
var _options =""
$.each(x, function(i, value) {
        _options +=('<option value="'+ value.id+'">'+ value.vendor_name +'</option>');
    });
$('#vendor_list').append(_options);

检查这个jsFiddle