JQuery附加了stange行为

Question

我无法解释这种.append()行为......

var listTopic = $.parseJSON(data);
for(i = 0; i < listTopic.length ; i++)
{
     $('#idSelect').append('<option>').append(listTopic[i].name).append('</option>');
}

输出：

<option></option>
value1
<option></option>
value2

Answer 1

由于您要插入的部分标签，浏览器会自动插入关闭/打开标签。

您可以改用以下内容：

var listTopic = $.parseJSON(data);
for(i = 0; i < listTopic.length ; i++) {
  $('#idSelect').append('<option>' + listTopic[i].name + '</option>');
}

或者，您也可以使用：

var listTopic = $.parseJSON(data);
for(i = 0; i < listTopic.length ; i++) {
  $('#idSelect').append($('<option />').text(listTopic[i].name));
}

如果您想同时设置value /文字：

var listTopic = $.parseJSON(data);
for(i = 0; i < listTopic.length ; i++) {
  $('#idSelect').append($('<option />').val(listTopic[i].name).text(listTopic[i].name));
}