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訪問後。