使用数据库返回的数据动态填充下拉列表

Populating a dropdown dynamically with data returned from database

本文关键字：动态 填充 下拉列表 数据 数据库 返回      更新时间：2023-09-26

我试图用数据库返回的数据填充下拉菜单。我的HTML是：

 <select class="Input"></select>

查询数据库后，我会尝试将数据附加到下拉列表中。

$(".Input").append(data[0].abc);

这里的"data[0].abc"指的是数组的第一个值。abc是返回值的字段名。如果该特定字段名有多个值，我计划使用for循环，该循环将遍历整个数组，并附加每个值并将其添加到下拉列表中。我得到了这些值，但似乎无法将它们添加到下拉列表中。如果我的思维过程错误，请纠正我。有人能给我指正确的方向吗？非常感谢。

试试这个：

$('.Input').append('<option>' + data[0].abc  + '</option');

为了澄清@Caner的答案，将这些添加到字符串中，然后仅将其附加到下拉列表中一次，速度要快得多。我无法告诉你我见过多少次这样做。我没有时间表，但相信我。

var options = '';
$.each(data, function(index, value) {
    options += '<option value="' + value.abc + '" text="' + value.abc + '" />';
});
$('.Input').append(options);

很好的解释是：字符串html生成和jquery DOM元素创建哪个更好？

相关文章：