1

その場でテーブル行の平均を計算し、同じタイプの行の合計を更新するために必要な Javascript を作成しようとしています。これを説明する簡略化された jsfiddle を次に示します。

http://jsfiddle.net/fmdataweb/5ZtQZ/3/

ユーザーは、ドロップダウン リストから任意の種類の果物を選択し、数と週を入力できます。たとえば、「Apple」を選択し、数値として 5 を入力し、週数として 26 を入力すると、自動的に平均が計算されます。この場合、平均は 2.5 (数値 * 週 / 52) になります。

また、同じ種類の果物の選択の平均を自動的に合計したいと思います。現在、 Number 列を合計しています - これを Average 列に変更し、平均が計算された後にこれを実行する必要があります。したがって、ユーザーが複数の行で Apple を選択した場合、これのすべてのインスタンスが検索され、Average 列の値が合計されます。

別のファイルから平均を計算するコードをいくつか取得しましたが、2 つのスクリプトを 1 つに結合するのに問題があるか、それが最適なオプションであるかどうか、または 2 つの別々のスクリプトを作成する方法がわからないのです。平均を計算するために見つけた疑似コードを次に示します。

$("#fruit input").live("keyup", function(){
var id = this.id.match(/\d+/);
var number = ( ($("#number"+id).val() * $("#weeks"+id).val()  )/52 );
var rounded = Math.round( number * 10 ) / 10;
$("#average"+id).val( rounded );

ID を使用すると、すべてが簡単になります。これを達成する方法について誰かが私を啓発できるかどうか、または同様のことを行う例を指摘できるかどうかに感謝します。私はJavascriptが初めてです。

4

1 に答える 1

1

私は別の方法で試しましたが、うまくいくようにしています：

trセルで反復し、.map（）で選択された各オプションの合計を計算します

これはJSです：

$('#fruits')
    .on('change', 'select', calc)
    .on('keyup', 'input', calc);

function calc(){

    $('#fruits tr:has(.fruit)').each(function(i,v){

        var $cel = $(v.cells);

        var $fruit = $cel.eq(1).find('option:selected').val();
        var $numb = $cel.eq(2).find('input').val();
        var $weeks = $cel.eq(3).find('input').val();
        var $avg = ($numb * $weeks) / 52;

        $cel.eq(4).find('input').val($avg);

    });   

    var tot = {};

    $('#fruits tr:has(.fruit) option:selected')
                .map(function(i){
                    var el = $(this).val();
                    var qty = parseFloat($('#fruits tr:has(.fruit)').eq(i).find('td:last input').val());
                    if (!tot.hasOwnProperty(el)) {
                        tot[el] = 0;            
                    }
                    tot[el] += qty
                    return tot;
                }).get();

    //console.log(tot);
    $('#sumApple').text(tot.Apple);
    $('#sumBanana').text(tot.Banana);
    $('#sumMango').text(tot.Mango);

}

そしてこれはフィドルです

PS：私は数値制御をしていません、buはあなたのものと同じです

于 2012-08-01T07:49:51.617 に答える