2

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());
        });
    });

ここで、'title' 属性が正しく設定されます。しかし、「タイトル」を「値」に変更すると、値が設定されません。

誰かがこれを機能させる方法を提案できますか?

4

1 に答える 1

2

必要なのはこれだけです:

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

cloneすべての要素とテキスト ノードのディープ コピーを実行するため、値をリセットする必要はありません。ここに例があります。http://jsfiddle.net/8bhfR/

于 2013-01-03T06:38:05.670 に答える