jquery - 在jQuery中删除所有行时如何克隆一行？

Question

这是我正在尝试运行的简单脚本。

http://jsfiddle.net/T8q5p/5/

我想要做的是为每个添加按钮添加一个新的输入框。我在每个表单上都附加了一个删除按钮。当我单击删除时，行会根据需要消失。

但是，当我删除所有这些时，我无法再添加任何输入字段。我认为这是因为所有列表项都已删除，因此没有什么可克隆的。

如果有 if 语句，说如果这是剩余的文本，只需清空值

      $(this).parent('li').val("");

?

不知道怎么插进去。。

谢谢

Answer 1

您可以将一个参考项目保存在一个变量中，然后从中克隆。此外，ID 必须是唯一的，因此将删除 id 更改为类。

http://jsfiddle.net/T8q5p/6/

var item = $("#tasks ul li:eq(0)").clone(true, true); // need to clone for new add
$('#add').click(function() {
    var taskItem = item.clone(true,true);
    $('#tasks ul').append(taskItem);
    taskItem.find(':input:text').val("");
    return false;
});
$('body').on('click','.delete',function() {
    $(this).parent('li').remove();
    return false;
});​

---

或者，您可以完全阻止删除最后一项：

if(!$(this).parent('li').is(':only-child')){
    $(this).parent('li').remove();
}