1

これが可能かどうか疑問に思っています。不可能な場合は、これを実現するためのイベントハンドラーを設定するための最良の方法です...

このようなスプレッドシートのようなHTMLテーブルがある場合：

<table>
   <tr id="row1">
      <td><input type="text" class="number" value="1"/></td>
      <td><input type="text" class="number" value="2"/></td>
      <td><input type="text" class="total" /></td>
   </tr>
</table>

次の行に沿って関数を記述できますか？

function getTotal() {
   var total = 0;
   $("#row1 .number").each(function() {
       total += Number($(this).val());
   };
   return total;
}

$("#row1 .total").val(getTotal);

入力の値がその行totalの入力の合計に自動的に変更されるように（入力ごとにイベントハンドラーを設定する必要はありません）？numberonchangenumber

理想的には、totalの値は他の入力の合計に設定されているため、変更するだけで、ページの読み込みと、その値が派生する入力の変更の両方で合計に設定されるようにします。 。

ユーザーが合計以外のセルに値を入力するページを作成しようとしています。関数は入力を検証します。理想的には、ユーザーが変更を加えるたびにすべての行を更新する必要はありませんが、同時に、行のセルが変更されたときにのみセル全体が更新されるように書き出す必要があるため、物事を過度に複雑にしたくありません。

4

3 に答える 3

2

これは、使用せずonchangeにどこでも呼び出すことができます。

function setTotal() {
   var total = 0;
   $("#row1 .number").each(function() {
       total += parseInt($(this).val());
   };
  $("#row1 .total").val(total);
}

自動的にトリガーする場合はonchange、次のようにページロードを追加するだけです。

$(function( {
  $("#row1 .number").change(setTotal); //When changing
  setTotal(); //On page load
});
于 2010-03-08T14:22:38.167 に答える
1

このようなもの：

$('#row1 input.number').change(function(){
    var total = 0;
    $('.number').each(function(){
        total += +$(this).val();
    }
    $('.total').val(total);
});

再計算を引き起こすイベントが必要です。ここでは、すべてのinput.number要素の変更イベントにしました。これは不要だと言います。ボタンイベントなど、好きなものにすることもできますが、何かを起こさずに.totalを「変更する」方法はありません。

于 2010-03-08T14:22:33.463 に答える
0

あなたがそうするとき、あなたは関数オブジェクトに.val(getTotal)設定しています（それは機能しません）。valもしあなたがそうしたら、あなたは.val(getTotal())その瞬間に合計を得るだけでしょう。

次のようなことを言ってみませんか。

$("#row1 .number).change(function () {
    $("#row1 .total").val(getTotal());
});
于 2010-03-08T14:22:06.630 に答える