jQuery的追加（）不工作

Question

我有这个<ul>

<ul id="select_opts" class="bullet-list" style="margin-left:15px;"></ul> 

这是为了去通过量JSON对象，并添加选项 到UL这段JavaScript代码：

$.each(q.opts, function(i,o) 
{       
    var str=''; 
    str+="<li id='li_" + i + "'><input type='text' id='opt_" + i + "' value='" + o.option + "'>"; 
    str+=" (<a href='javascript:delOpt(" + i + ");'>Delete</a>) </li>"; 
    $("#select_opts").append(str); 

}); 

如果我做console.log（）我可以看到循环正在工作。如果我这样做：

console.log($("#select_opts").html()); 

它显示正在按预期更新的HTML。但是，在浏览器窗口中，它显示UL为空的 ！

我在做什么错？

Answer 1

我发现错误，码的另一部分被排空时<ul>我点击某个按钮。

Answer 2

$("select_opts").append(str); 

应该

$("#select_opts").append(str); 

Answer 3

你指按ID对象，以便你错过＃

$.each(q.opts, function(i,o) 
{       
    var str=''; 
    str+="<li id='li_" + i + "'><input type='text' id='opt_" + i + "' value='" + o.option + "'>"; 
    str+=" (<a href='javascript:delOpt(" + i + ");'>Delete</a>) </li>"; 
    $("#select_opts").append(str); 
    //^
} 

Answer 4

我想像input需要正确地自我封闭。

Answer 5

这是一个错字？：

$("select_opts").append(str); 

你的意思是？：

$("#select_opts").append(str); 

更新：

试试这个：

$.each(q.opts, function(i, o) { 
    var li = $('<li>').attr('id', 'li_' + i); 
    var in = $('<input>').attr('type', 'text').attr('id', 'opt_' + i).val(o.option); 
    var aa = $('<a>').attr('href', 'javascript:delOpt(' + i + ');').text('Delete'); 
    li.append(in).append(aa) 
    $("#select_opts").append(li); 
}); 

Answer 6

我实在看不出有什么不对，但它试一下，只是为了看看它的工作原理...

$(str).appendTo("#select_opts"); 

双方应该工作。

Answer 7

标记输入应关闭 - 如果不这样做，用的append（）在Internet Explorer无效HTML时，股利不投入DOM树，所以你不能用jQuery访问后。