7

したがって、これの短いバージョンは次のとおりです。セレクターの一致した要素内の要素のみを走査できますeach()か? each()または、ループなしで必要なものを取得する簡単な方法はありますか?

これははるかに簡単だと思ったので、jqueryで要素をトラバースするという基本的な原則が欠けているだけだと思います。

シナリオは次のとおりです。

各セルにテキストがあるテーブルがあります（この場合は適切です）input。最後の入力は読み取り専用で、その行に入力された他の値の合計と見なされます。各行の合計と、各行の合計の総計の両方を見つけるための非常に厄介な js スクリプトがあります。

基本的な HTML は次のとおりです。

<table>
<thead>
<tr><th>Col 1</th><th>Col 2</th><th>Col 3</th><th>Total</th></tr>
</thead>
<tbody>
<tr id="row1"><td><input type="text" /></td><td><input type="text" /></td><td><input type="text" /></td><td class="total"><input type="text" readonly="readonly" /></td></tr>
<tr id="row2"><td><input type="text" /></td><td><input type="text" /></td><td><input type="text" /></td><td class="total"><input type="text" readonly="readonly" /></td></tr>
<tr id="row3"><td><input type="text" /></td><td><input type="text" /></td><td><input type="text" /></td><td class="total"><input type="text" readonly="readonly" /></td></tr>
</tbody>
</table>

明確にするために、javascript は、入力されたデータが数値であることを検証します。

onchangeそのため、ユーザーがデータを入力して次のセル/入力に移動したときに合計を更新するための各入力のイベントリスナーがあります。次にupdateTotal、現在forループを使用して各行をループし、そのループ内で各セルをループし、最終的に合計セルの入力を合計するように設定する関数を呼び出します。

簡単なメモ: 以下のコードを含めたのは、私が手渡しを探しているだけではないことを示し、私が考えていることの基本的なロジックを示すためです。この部分は読み飛ばしたりスキップしたりしてください。それは機能し、デバッグや批評は必要ありません。

これは次のようになります。

function updateTotal() {
    table = document.getElementsByTagName("tbody")[0];
    allrows = table.getElementsByTagName("tr");
    grandtotal = document.getElementById("grand");
    grandtotal.value = "";

    for (i = 0; i < allrows.length; i++) {
        row_cells = allrows[i].getElementsByTagName("input");
        row_total = allrows[i].getElementsByTagName("input")[allrows.length - 2];
        row_total.value = "";

        for (ii = 0; ii < row_cells.length - 1; ii++) {
            row_total.value = Number(row_total.value) + Number(row_cells[i][ii].value);
            grandtotal.value = Number(grandtotal.value) + Number(row_cells[i][ii].value);
        }
    }
}

今、私は上記をjquery構文で書き直そうとしていますが、行き詰まっています。each()最善の方法は、次の行に沿ってループを使用することだと思いました。

function findTotals() {
$("tbody tr").each(function() {
    row_total = 0; 
    $($(this) + " td:not(.total) input:text").each(function() {
        row_total += Number($(this).val());
        }); 
    $($(this) + " .total :input:text").val(row_total);
});

}

しかし、$(this)思ったように使えないようです。私は読ん$(this)で、各ループでの使用が一致した各要素を指していることを見ました。上記では、grand_total ビットも省略されています。これは、総計変数を機能させるのにさらに運が悪かったためです。row_totals を取得するためだけに次のことを試しました。

 $($(this).attr("id") + " td:not(.total) input:text").each(function() {

ある程度成功しましたが、追加しようとしたときになんとか壊れました。各部分は私が考えている行を指す必要があるため、これを機能させるために各行にIDを付ける必要はないと思います。

したがって、これの短いバージョンは次のとおりです。各ループを使用して、一致する要素のみをトラバースできますか?もしそうなら、正しい構文は何ですか? または、各ループなしで必要なものを取得する簡単な方法はありますか?

ああ、最後にもう 1 つ考えました...

jqueryを使用して、一致したすべての要素の数値合計(1つの長い文字列ではなく)を取得することは可能ですか? 私はこれを自分でもっと研究しますが、誰かが知っていれば、これのいくつかはずっと簡単になります.

4

2 に答える 2

16

コンテキストを誤って設定しようとしています。これを試してください：

function findTotals() {
    $("tbody tr").each(function() {
        row_total = 0; 
        $("td:not(.total) input:text",this).each(function() {
           row_total += Number($(this).val());
        }); 
        $(".total :input:text",this).val(row_total);
    });

}

コンテキストの詳細については、jquery のドキュメントを参照してください: http://docs.jquery.com/Core/jQuery#expressioncontext

于 2009-09-01T01:09:22.607 に答える
0

セレクターには 2 つのパラメーターを指定できます。2 番目のパラメーターは、検索が行われるコンテキスト htat です。次のようなものを試してください: $('#tableID tbody tr).each(function(){ //これはテーブル行なので、単にその行のすべてのテキストボックス、おそらく sum と呼ばれる css クラスまたは他の属性によって).val() はテキストボックスの値などを取得します。 }); //この関数の外では、合計を取得します。//隠しフィールドまたはグローバル変数に追加して、行の合計などを取得します。 });

于 2009-09-01T01:14:59.543 に答える