通过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>