事件委托问题

Question

表格填充后，我正在尝试克隆表格。 在td内，我放置了一些输入和textarea标签。 我的问题是表中的内容未克隆。 我曾尝试使用事件委托，但似乎我做错了事。 这是JSfiddle，在表中写一些东西，然后按clone.`` http://jsfiddle.net/no84bror/2/

  $("#clonetable").on('click','textarea',function(){
    var tempTable = $('#masterTable');
    var temClone = $("<div/>").append(tempTable.clone()).html(); 
   // alert(temClone);
    var rep = temClone.replace("textarea","p");
    $("#a").html(rep);
    });

Answer 1

这是一个jquery错误-深度克隆不适用于textareas http://bugs.jquery.com/ticket/3016它最初在Firefox中是一个问题，但在Chrome中显然是相同的。

“当前行为已在api.jquery.com上进行了记录，当然也可以在此处进行记录。可以使用插件来提供所请求的行为。该票证被标记为patchwelcome，但需要注意的是，修复jQuery内部这种边缘情况会导致性能下降90不需要的时间百分比。”

以下代码可以工作并复制输入字段的内容，但是由于上述错误，您将不得不自己复制textareas的内容或使用插件。

$("#clonetable").on('click', function(){
     $("#a").html($('#masterTable').clone());
});

您可以尝试使用.clone( [withDataAndEvents][, deepWithDataAndEvents] ) ，换句话说，使用.clone(true, true) ，但这没什么区别。

---

这是代码，包括复制textarea内容的技巧：

 $("#clonetable").on('click',function(){
    $("#a").html($('#masterTable').clone());
    var my_textareas     = $('#masterTable textarea').slice(2,4);
    var result_textareas = $("#a textarea");

    for (var i = 0, l = my_textareas.length; i < l; ++i){
        $(result_textareas[i]).val($(my_textareas[i]).val());
    }
 });