- ベストアンサー
javascriptによる計算
テキストボックス「a1～6」の値とテキストボックス「b1～6」に入力された値を足し算してテキストボックス「ｃ1～6」（例…c[i] = a[i] + b[i]）を計算するJavaScriptを作成しているのですが、結果がundefinedになってしまい上手くいきません。どうやったら動くのかどうかご教授ください。 以下ソース↓ <script language ="JavaScript"> function plus() { var intResult = 0; for (i=1; i<=6; i++){ intResult[i] = 0; if (!isNaN(document.forms["A"].all["a"+i].value) && !isNaN(document.forms["B"].all["b"+i].value)){ intResult[i] += parseInt(document.forms["A"].all["a"+i].value); intResult[i] += parseInt(document.forms["B"].all["b"+i].value); } <table border = 1> <tr> <td> <table border = 1> <tr> <td> <form name="A"> <input type = "text" size = 5 name = "a1"></input> </td> <td> <input type = "text" size = 5 name = "a2"></input> </td> <td> <input type = "text" size = 5 name = "a3"></input> </td> </tr> <tr> <td> <input type = "text" size = 5 name = "a4"></input> </td> <td> <input type = "text" size = 5 name = "a5"></input> </td> <td> <input type = "text" size = 5 name = "a6"></input> </form> </td> </tr> </table> </td> <td> <table boeder = 1> <tr> <input type = "button" onClick="plus()" value = "＋"></input> </tr> </table> </td> <td> <table border = 1> <tr> <td> <form name = "B"> <input type = "text" size = 5 name = "b1"></input> </td> <td> <input type = "text" size = 5 name = "b2"></input> </td> <td> <input type = "text" size = 5 name = "b3"></input> </td> </tr> <tr> <td> <input type = "text" size = 5 name = "b4"></input> </td> <td> <input type = "text" size = 5 name = "b5"></input> </td> <td> <input type = "text" size = 5 name = "b6"></input> </form> </td> </tr> </table> </td> </tr> </table> 答え <form name = "C"> <table border = 1> <tr> <td> <input type = "text" size = 5 name = "c1"></input> </td> <td> <input type = "text" size = 5 name = "c2"></input> </td> <td> <input type = "text" size = 5 name = "c3"></input> </td> </tr> <tr> <td> <input type = "text" size = 5 name = "c4"></input> </td> <td> <input type = "text" size = 5 name = "c5"></input> </td> <td> <input type = "text" size = 5 name = "c6"></input> </td> </tr> </table> </form> </body> document.C.all["c"+i].value = intResult[i]; } } </script>
- mimimii191
- お礼率45% (5/11)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
==========================Q3519050-1.html================== <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Q3519050 TestCase 2</title> <script type="text/javascript" src="Q3519050-1.js"></script> </head> <body> <!-- 個人的な都合で name属性でなくid属性を使うように変更。 a1～a6でなくa0～a5にした。 またtableのネストが嫌いなので元の形にはしていない。 --> <h1>Q3517253 TestCase 1</h1> <h2>Operand1</h2> <table> <tr> <td> <input type="text" id="a0" /> </td> <td> <input type="text" id="a1" /> </td> <td> <input type="text" id="a2" /> </td> </tr> <tr> <td> <input type="text" id="a3" /> </td> <td> <input type="text" id="a4" /> </td> <td> <input type="text" id="a5" /> </td> </tr> </table> <h2>Operand2</h2> <table> <tr> <td> <input type="text" id="b0" /> </td> <td> <input type="text" id="b1" /> </td> <td> <input type="text" id="b2" /> </td> </tr> <tr> <td> <input type="text" id="b3" /> </td> <td> <input type="text" id="b4" /> </td> <td> <input type="text" id="b5" /> </td> </tr> </table> <h2>Run</h2> <p><input type="button" value="各項目を足す" onclick="plus();" /></p> <h2>Results</h2> <table> <tr> <td> <input type="text" id="c0" /> </td> <td> <input type="text" id="c1" /> </td> <td> <input type="text" id="c2" /> </td> </tr> <tr> <td> <input type="text" id="c3" /> </td> <td> <input type="text" id="c4" /> </td> <td> <input type="text" id="c5" /> </td> </tr> </table> </body> </html> ===================Q3519050-1.js================ function plus(){ var intResult = new Array(6); var i; for (i=0; i<=5; i++){ intResult[i-1] = 0; /* 最大の敗因。ArrayじゃなきゃいけないものにNumberを代入してどーすんの？ */ /* 空文字は0としてみなされるようだ */ if (!isNaN(document.getElementById("a" + i.toString()).value) && !isNaN(document.getElementById("b" + i.toString()).value)){ /* parseIntからNumberに変更。parseIntを使いたかったら条件の変更が必要 */ intResult[i-1] += Number(document.getElementById("a" + i.toString()).value); intResult[i-1] += Number(document.getElementById("b" + i.toString()).value); } document.getElementById("c" + i.toString()).value = intResult[i-1]; } }
その他の回答 (1)
- redfox63
- ベストアンサー率71% (1325/1856)
テキストボックスの命名を考え直します 同じ系統の a1-a6をtxtA、b1-b6をtxtB、c1-c6をtxtCとします 添え字はつけないようにします 例 <tr> <td><input type=text name=txtA></td> <!-- txtA[0] --> <td><input type=text name=txtA></td> <!-- txtA[1] --> <td><input type=text name=txtA></td> <!-- txtA[2] --> </tr> <tr> <td><input type=text name=txtA></td> <!-- txtA[3] --> <td><input type=text name=txtA></td> <!-- txtA[4] --> <td><input type=text name=txtA></td> <!-- txtA[5] --> </tr> 演算関数 function plus() { var objA, objB; var flagA, flagB; var n; for( n=0; n < 6; n++ ) { // テキストボックスのデータを取得 objA = document.A.txtA[i].value; objB = document.B.txtB[i].value; // 数値かどうかのチェック flagA = !isNaN( Number( objA ) ) && ( objA != "" ); flagB = !isNaN( Number( objB ) ) && ( objB != "" ); // 双方数値なら演算 & 答えの記入 if ( flagA && flagB ) { document.C.txtC[i] = parseInt( objA ) + parseInt( objB ); } } } # 字下げは全角スペースです ・・・
お礼
そうですね！配列定義するのを忘れていました…。 おかげで無事動きました！ありがとうございます！