jQuery clone(） 将用户数据保留在输入字段中

jQuery clone() leaves user data in input field

本文关键字：保留 输入 字段 数据 用户数 clone 用户 jQuery      更新时间：2023-09-26

参见jsfiddle：http://jsfiddle.net/bjCz3/

.html

<table> <tr class="copyMe"> <td><input type="text" name="test" /></td> </tr> </table> <a id="clickMe" href="#">Click Me</a>

jquery

  $('#clickMe').click(function(event){
   event.preventDefault();
   var tr = $('.copyMe:last');
   var newTr = tr.clone();
   newTr.appendTo(tr.parent());
  });

如果在输入中键入文本，然后单击单击我，则会克隆并插入该行（包括输入），并包含您输入的数据。

clone（） 的 API 说：

.clone（） 方法执行匹配的集合的深层复制 元素，这意味着它复制匹配的元素以及所有 其后代元素和文本节点。出于性能原因， 表单元素的动态状态（例如，键入输入的用户数据，以及文本区域或用户对选择所做的选择）不会被复制 到克隆的元素。克隆操作将这些字段设置为 它们在 HTML 中指定的默认值。

http://api.jquery.com/clone/

那么为什么我的输入要填充值，更重要的是，我该如何防止它呢？我希望它们像文档所暗示的那样是空的/默认的。我尝试将两个参数都指定为 false，即使它们默认为假，它仍然复制它。

如果您

正在使用未选中的输入或在页面加载时设置了值。（或者您想要设置的默认值）...在用户触摸一行之前缓存一行。然后克隆该存储行以在需要时追加

/* store row on page load*/
 var tr = $('.copyMe:last').clone();
 $('#clickMe').click(function(event){
   event.preventDefault();
  var newTr = tr.clone();....
})

至于自己清除它的方法。

$('#clickMe').click(function(event){
  event.preventDefault();
  var tr = $('.copyMe:last');
  var newTr = tr.clone();
  newTr.find('input').val('');
  newTr.appendTo(tr.parent());
});

更新

newTr.find("input[type=text], textarea").val("");
newTr.find('input:checkbox').removeAttr('checked');

http://jsfiddle.net/bjCz3/3/

在jquery上填写错误报告后自己做：

  $('#clickMe').click(function(event){
   event.preventDefault();
   var tr = $('.copyMe:last');
   var newTr = tr.clone();
   newTr.find(":input").val(''); //find all input types (input, textarea), empty it.
   newTr.appendTo(tr.parent());
  });

更新的工作小提琴：http://jsfiddle.net/bjCz3/2/

相关文章：