通過Jquery將新項目保存到UL列表

Question

我有以下問題：我有一個UL列表，我想通過輸入字段通過jQuery添加到列表中的值。點擊保存鏈接後，輸入應該顯示爲新的li條目。

的HTML

<ul id="first"> 
<li><input name="" size="40" maxlength="60" value="" id="up-form" /> <a href="javascript:;" onClick="javascript: $('#first').add('<li>'+$('#up-form').val()+'</li>');">Save</a></li> 
</ul> 

當保存-Link的點擊輸入字段的值不會出現在列表中的新裏。任何想法或tipps？

Answer 1

變化.add到.append

報價該add方法

的.add()方法從那些 元件的聯合和傳遞到 方法的那些構造新 jQuery對象。從append方法

報價

的.append()方法插入指定的內容作爲 最後一個子的 jQuery的集合

演示中的每個元素的在http://www.jsfiddle.net/yS7eG/

Answer 2

我相信這是你在找什麼：jQuery - How can i dynamically add a list item to an unordered list?

Answer 3

你會與一個click事件，這樣更好：

$("#first > li > a").click(function(){ 
    $("#first").append('<li>'+$('#up-form').val()+'</li>'); 

    return false; 
}); 

你也可以使用$(this).closest("ul").append('<li>'+$('#up-form').val()+'</li>');。

然後HTML可以改爲：

<ul id="first"> 
    <li><input name="" size="40" maxlength="60" value="" id="up-form" /> <a href="">Save</a></li> 
</ul>