jQuery克隆不复制选项值

Question

我想克隆一个HTML表格行，并动态地使用jQuery将新行添加到表的末尾。该行有许多下拉控件。我正在尝试克隆该行。大多数控件被复制，但选项的值不会被复制。所以我试图明确设置选项值。这也是行不通的。

//original table row and its clone 
var $tr = $("tr.RowToBeCopied").last(); 
var $clone = $tr.clone(); 

var originalSelects = $tr.find("select"); 
    $(originalSelects).each(function (i) { 
     var select = this; 
     var originalOptions = $(select).find("option"); 

     $(originalOptions).each(function (j) { 
      var originalOption = this; 
      $($clone.find("select").eq(i)) 
       .find("option").eq(j) 
        .val($(originalOption).val()); 
     }); 
    }); 

$tr.after($clone); 

我试着用下面的代码将其设置属性 - >

var originalSelects = $tr.find("select"); 
    $(originalSelects).each(function (i) { 
     var select = this; 
     var originalOptions = $(select).find("option"); 

     $(originalOptions).each(function (j) { 
      var originalOption = this; 
      $($clone.find("select").eq(i)) 
       .find("option").eq(j) 
        .attr("title", $(originalOption).val()); 
     }); 
    }); 

在这里， '标题' 属性被设置正确。但是，如果我将“标题”更改为“值”，则不会设置值。

有人可以请建议一种方法来得到这个工作吗？

Answer 1

所有你需要的是这样的：

var $tr = $("tr.RowToBeCopied").last(); 
$tr.clone().insertAfter($tr); 

clone执行所有元素和文本节点的深层副本，你不必重新设置该值。这是一个例子。 http://jsfiddle.net/8bhfR/。