自動計算について

質問

A1×B1=C1
A2×B2=C2
A3×B3=C3
A4×B4=C4

のような自動計算で、その後
C1～C4までの結果の合計を出したい場合はどうしたら良いのでしょう？
Aにはプルダウンで選んだ数値が、Bには入力してもらった数値が入ります。
Cは出るのですがその後の処理が判らず困っています。
わかる方お願いします。

回答No.1

askaaska · ベストアンサー

明細の合計処理ね。

C1～C4の合計の出し方はできる前提でいいわよね。
その計算処理を記述した関数を仮にsumCとするわ。

A×B=Cの自動計算はできると思っていいのよね。

ここまできたらできるわ。
A×B=Cの計算処理の直後に関数sumCを実行すればいいのよ。

お礼

初心者ですがsumというアドバイス頂き、本を見ながらやってみたら出来ました。
難しく考えすぎていたようです。

とてもすっきりしました！
回答ありがとうございます。

回答No.2

yuu_x

<script type="text/javascript" for="window" event="onload">
<!--
/*@cc_on
( function( ) {
　var form = document.all.item( 'calculation-sheet' );

　for( var i=0, I=form.elements.length; i < I; i++ ) {
　　form.elements[ i ].attachEvent( 'onchange', calculate );
　}
} )( );
@*/

function calculate( evt ) {
　var target = evt./*@if(1) srcElement @else@*/ target /*@end@*/;
　var eles = target.form.elements;
　var no = target.name.match( /\d+$/ );
　var total = Number( eles[ 'total' ].value ) - Number( eles[ 'C' + no ].value );

　total += eles[ 'C' + no ].value = Number( eles[ 'A' + no ].value ) * Number( eles[ 'B' + no ].value );
　eles[ 'total' ].value = total;
}
//-->
</script>

<form action="#" id="calculation-sheet" onchange="calculate( event );">
<table>
　<thead>
　　<tr><th></th><th>A</th><th>B</th><th>C</th></tr>
　</thead>
　<tbody>
　　<tr>
　　　<th>1</th>
　　　<td>
　　　　<select name="A1">
　　　　　<option value="1" selected>1</option>
　　　　　<option value="2">2</option>
　　　　　<option value="3">3</option>
　　　　</select>
　　　</td>
　　　<td><input type="text" name="B1" value="0"></td>
　　　<td><input type="text" name="C1" value="0" readonly></td>
　　</tr>
　　<tr>
　　　<th>2</th>
　　　<td>
　　　　<select name="A2">
　　　　　<option value="1" selected>1</option>
　　　　　<option value="2">2</option>
　　　　　<option value="3">3</option>
　　　　</select>
　　　</td>
　　　<td><input type="text" name="B2" value="0"></td>
　　　<td><input type="text" name="C2" value="0" readonly></td>
　　</tr>
　　<tr>
　　　<th>3</th>
　　　<td>
　　　　<select name="A3">
　　　　　<option value="1" selected>1</option>
　　　　　<option value="2">2</option>
　　　　　<option value="3">3</option>
　　　　</select>
　　　</td>
　　　<td><input type="text" name="B3" value="0"></td>
　　　<td><input type="text" name="C3" value="0" readonly></td>
　　</tr>
　　<tr>
　　　<th></th>
　　　<td></td>
　　　<td></td>
　　　<td><input type="text" name="total" value="0" readonly></td>
　　</tr>
　</tbody>
</table>
</form>

(*)全角スペースでインデントしてあるので、コピペする場合は半角に置換してください。

お礼

丁寧に教えて頂きありがとうございます。
まさにこんな感じのものです！
初心者なので書いていただいた中でわからない部分がありますが、参考にさせていただきました。
色々な方法があるようですね。

ありがとうございました。