合計値の表示

質問

コード/品名/単価
01/鰯/10円
02/鮭/20円
というデータがあって
--ソースstart--
function codeChange(c, n){
if(document.getElementById){
if(c==01){
document.getElementById("sina"+[n]).innerHTML=("鰯");
}else if(c==02){
document.getElementById("sina"+[n]).innerHTML=("鮭");
}
}
function suryoChange(s, n){
if(document.getElementById){
if(c==01){
document.getElementById("sum"+[n]).innerHTML=(10*s);
}else if(c==02){
document.getElementById("sum"+[n]).innerHTML=(20*s);
}
}…
<table>
<tr>
<td><input type="text" name="code1" onChange="javascript:codeChange(document.forms(0).code1.value, 1)"></td>
<td><div id="sina1"></td>
<td><input type="text" name="suryo1" onChange="javascript:suryoChange(document.forms(0).code1.value, 1)"></td>
<td><div id="sum1"></td>
</tr>
<tr>
<td><input type="text" name="code2" onChange="javascript:codeChange(document.forms(0).code2.value,2)"></td>
<td><div id="sina2"></td>
<td><input type="text" name="suryo2" onChange="javascript:suryoChange(document.forms(0).code2.value,2)"></td>
<td><div id="sum2"></td>
</tr>
</table>
--ソースend--
<div id="total"></div>
で数量の入力値が変わるごとに
各合計のトータルの合計を表示したいのですが
やり方がわかりません。
よろしくお願いします。

回答No.1

mrumesuke · ベストアンサー

可読性を上げるためにも、最低限のコメントは書くべきです。
※ 下記ソースをコピーする時は全角スペースをタブに置き換えてください。
私からの宿題
・コードを変えた時も合計を計算しなおした方が良いのでは？
・リロードした時に数字が残っていたらどうする？

sum = new Array();
function codeChange(n){
　// c=コード
　// n=行
　c = document.getElementById("code"+n).value;

　// 品名の表示
　if(document.getElementById){
　　if(c==01){
　　　document.getElementById("sina"+n).innerHTML="鰯";
　　}else if(c==02){
　　　document.getElementById("sina"+n).innerHTML="鮭";
　　} else {
　　　document.getElementById("sina"+n).innerHTML="";
　　}
　}
}
function suryoChange(n){
　// c=コード
　// s=数量
　// n=行
　c = document.getElementById("code"+n).value;
　s = document.getElementById("suryo"+n).value;

　// 行ごとの合計の計算と表示
　if(document.getElementById){
　　if(c==01){
　　　sum[n] = 10*s;
　　}else if(c==02){
　　　sum[n] = 20*s;
　　} else {
　　　sum[n] = "";
　　}
　　document.getElementById("sum"+n).innerHTML=sum[n];
　}
　// 合計の表示
　if (!(isNaN(sum[1]) || isNaN(sum[2]))) {
　　document.getElementById("total").innerHTML = sum[1]+sum[2];
　}
}

（略）

<form>
<table>
<tr>
<th>コード</th>
<th>品名</th>
<th>数量</th>
<th>計</th>
</tr>
<tr>
<td><input type="text" id="code1" onChange="javascript:codeChange(1)"></td>
<td><div id="sina1"></td>
<td><input type="text" id="suryo1" onChange="javascript:suryoChange(1)"></td>
<td><div id="sum1"></td>
</tr>
<tr>
<td><input type="text" id="code2" onChange="javascript:codeChange(2)"></td>
<td><div id="sina2"></td>
<td><input type="text" id="suryo2" onChange="javascript:suryoChange(2)"></td>
<td><div id="sum2"></td>
</tr>
</table>
</form>
<div id="total"></div>

お礼

有難うございました。
あまり詳しい説明もつけずにすみませんでした。
今後、気おつけて質問をしたいと思います。
本当に有難うございます。