Question

我有以下问题：我有一个UL-List，我想通过输入字段通过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>

单击“保存链接”时，“输入”字段的值不会在列表中显示为新的li。有什么想法或想法吗？

Answer 1

点击事件会更好，例如：

$("#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>

Answer 2

将.add更改为.append

来自add方法的引用

.add()方法构造一个新的来自这些联盟的 jQuery对象 元素和传入的元素方法

来自append方法的引用

.append()方法插入指定的内容为最后一个孩子的每个元素 jQuery集合

http://www.jsfiddle.net/yS7eG/

演示

Answer 3

我相信这正是您所寻找的：jQuery - How can i dynamically add a list item to an unordered list?

通过Jquery将新项目保存到UL-List

3 个答案: