17

テーブルの行を複製し、いくつかのプロパティを設定してからテーブルに追加する次のサンプルコードを考えます。

$("#FundTable").append(
    objButton.parents("tr").clone()
        .find(".RowTitle").text("Row " + nAddCount).end()
        .find(".FundManagerSelect").attr("id", "FundManager" + nAddCount)
                                .change(function() { ChangeFundRow(); }).end()
        .find(".FundNameSelect").attr("id", "FundName" + nAddCount).end()
);

これをどのようにフォーマットして見やすくするかについて、誰か提案がありますか？これを行うために受け入れられている規則はありますか？

従うことができ、一連の標準に組み込むことができる一連の規則があると便利です。

4

4 に答える 4

23

これにリファクタリングします。3つ以上の連鎖した方法は目に不安を感じる

       var $clonedRow =  objButton.parents("tr").clone();

       $clonedRow.find(".RowTitle") 
                 .text("Row " + nAddCount);

       $clonedRow.find(".FundManagerSelect")
                 .attr("id", "FundManager" + nAddCount)
                 .change( ChangeFundRow );

       $clonedRow.find(".FundNameSelect")
                 .attr("id", "FundName" + nAddCount);

       $clonedRow.appendTo("#FundTable");
于 2009-08-17T08:55:20.227 に答える
13

かっこで囲まれているかのようにインデントします。

$("#FundTable")
    .append(objButton.parents("tr")
        .clone()
        .find(".RowTitle")
            .text("Row " + nAddCount)
        .end()
        .find(".FundManagerSelect")
            .attr("id", "FundManager" + nAddCount)
            .change(function() {
                ChangeFundRow(); // you were missing a semicolon here, btw
            })
        .end()
        .find(".FundNameSelect")
            .attr("id", "FundName" + nAddCount)
        .end()
    )
;
于 2009-08-17T09:03:59.490 に答える
4

どうですか：

$("#FundTable").append(
    objButton.parents("tr").clone()
        .find(".RowTitle").text("Row " + nAddCount)
        .end()
        .find(".FundManagerSelect").attr("id", "FundManager" + nAddCount)
        .change(function() { 
            ChangeFundRow() 
        })
        .end()
        .find(".FundNameSelect").attr("id", "FundName" + nAddCount)
        .end()
);

連鎖を適度に使用すると、読みやすさが向上することがわかりました。

于 2009-08-17T08:50:03.200 に答える
2

あまり連鎖しないでください。

var newContent = objButton.parents("tr").clone();

newContent.find(".RowTitle").text("Row " + nAddCount)
newContent.find(".FundManagerSelect").attr("id", "FundManager" + nAddCount)
    .change(function() { ChangeFundRow() });
newContent.find(".FundNameSelect").attr("id", "FundName" + nAddCount);

$("#FundTable").append(newContent);

連鎖は少ないですが、読みやすいようです。

于 2009-08-17T08:53:19.480 に答える