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/。