如何使用jquery动态创建select元素的选项?

时间:2012-03-15 20:48:21

标签: jquery

我需要通过ajax调用动态创建select元素的选项。选项的数量及其内容会有所不同。这是它在ajax调用之前的样子:

 <select name="groupid" style="width:100%;">
<option value="0" selected>(Please select an option)</option>
</select>

以下是我尝试使用虚拟值创建选项元素的一种方法:

$("<option></option>", {value: "999"}).appendTo('.select-group');

但它将其添加到select之外。我也不知道如何设置文本。

有什么想法吗?我已经看到一些关于使用静态数量的现有选项填充现有选择表单的问题,但不是这样的问题。

感谢。

5 个答案:

答案 0 :(得分:37)

.select-group的位置?如果您使用#groupid的ID,那么这应该可以正常工作......

$('<option>').val('999').text('999').appendTo('#groupid');

答案 1 :(得分:17)

这是解决方案..

$('#yourSelectBoxId').append(new Option('optionName', 'optionValue'));

答案 2 :(得分:9)

如果我理解正确,下面就是你需要的,

$("<option></option>", 
     {value: "999", text: "Nine Ninety Nine"})
    .appendTo('.select-group');

DEMO

提供.select-group<select></select>

的选择器

答案 3 :(得分:4)

这是另一种解决方案。这对我有用。

$('#yourSelectBoxId').append("<option value='Saab'>Saab</option>");

答案 4 :(得分:0)

这对我有用:

$('#chat_list').append(new Option(this.subject, this.key_remote_jid));