• ベストアンサー

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>

質問者が選んだベストアンサー

  • ベストアンサー
回答No.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]; } }

mimimii191
質問者

お礼

そうですね！配列定義するのを忘れていました…。 おかげで無事動きました！ありがとうございます！

その他の回答 (1)

  • redfox63
  • ベストアンサー率71% (1325/1856)
回答No.1

テキストボックスの命名を考え直します 同じ系統の 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 ); 　　　　} 　　} } # 字下げは全角スペースです ・・・

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • ２つのフォームに値を入れて計算

    ２つのフォームを作り、その２つを計算したいのですがオブジェクトの指定の仕方がエラーが出てしまい(オブジェクトを指定してくださいと出ます)わかりません。 どうか教えてください。 ちなみにforなどは使わなくても大丈夫ですのでよろしくお願いします。 function kei() { var kei1 = 0; kei1=eval(document.A.a11.value) * eval(document.B.b21.value) ; document.C.c11.value = kei1; } <table border = 1> <form name="A"> <tr> <td> <input type = "text" size = 5 name = "a11"></input> </td> <td> <input type = "text" size = 5 name = "a12"></input> </td> <td> <input type = "text" size = 5 name = "a13"></input> </td> </tr> <tr> <td> <input type = "text" size = 5 name = "a21"></input> </td> <td> <input type = "text" size = 5 name = "a22"></input> </td> <td> <input type = "text" size = 5 name = "a23"></input> </td> </tr> </form> </table> <table boeder = 1> <tr> <input type = "button" onClick="kei()" value = "×"></input> </tr> </table> <table border = 1> <form name="B"> <tr> <td> <input type = "text" size = 5 name = "b21"></input> </td> <td> <input type = "text" size = 5 name = "b22"></input> </td> <td> <input type = "text" size = 5 name = "b23"></input> </td> </tr> <tr> <td> <input type = "text" size = 5 name = "b31"></input> </td> <td> <input type = "text" size = 5 name = "b32"></input> </td> <td> <input type = "text" size = 5 name = "b33"></input> </td> </tr> </form> </table> <table border = 1> <form name="C"> <tr> <td> <input type = "text" size = 5 name = "c11"></input> </td> <td> <input type = "text" size = 5 name = "c12"></input> </td> <td> <input type = "text" size = 5 name = "c13"></input> </td> </tr> <tr> <td> <input type = "text" size = 5 name = "c21"></input> </td> <td> <input type = "text" size = 5 name = "c22"></input> </td> <td> <input type = "text" size = 5 name = "c23"></input> </td> </tr> </form> </table>

  • 再度読み込みは出来ないのでしょうか？

    各テキストボックスに値を入れて、 C11 = a11 * b11 + a12 * b21 + a13 * b31、 c12 = a11 * b12 + a12 * b22 + a13 * b32、 ： ： c21 = a21 * b11 + a22 * b21 + a23 * b31 c22 = a21 * b12 + a22 * b22 + a23 * b32・・・ としたいのですが、うまくロジックが思いつきません。 単純に式をずらずら書いたのですが、c12以降の欄がすべてゼロになってしまいます。 いい方法を教えてください。お願いします。 <head> <script> function kei(){ var form_a=document.getElementById('A'); var form_b=document.getElementById('B'); var form_c=document.getElementById('C'); var keic11 = 0; var keic12 = 0; : : keic11=parseInt(form_a.a11.value) * parseInt(form_b.b11.value) * parseInt(form_a.a12.value) * parseInt(form_b.b21.value) + parseInt(form_a.a13.value) * parseInt(form_b.b31.value); form_c.c11.value = keic11; keic12=parseInt(form_a.a11.value) * parseInt(form_b.b12.value) + parseInt(form_a.a12.value) * parseInt(form_b.b22.value) + parseInt(form_a.a13.value) * parseInt(form_b.b32.value); form_c.c12.value = keic12; 　　　　： 　　　　： } </script> </head> <body> <table border = 1> <form id = "A"> <tr> <td> <input type = "text" size = 5 name = "a11"></input> </td> <td> <input type = "text" size = 5 name = "a12"></input> </td> <td> <input type = "text" size = 5 name = "a13"></input> </td> </tr> <tr> <td> <input type = "text" size = 5 name = "a21"></input> </td> <td> <input type = "text" size = 5 name = "a22"></input> </td> <td> <input type = "text" size = 5 name = "a23"></input> </td> </tr> </form> </table> <table boeder = 1> <tr> <input type = "button" onClick="kei()" value = "×"></input> </tr> </table> <table border = 1> <form id = "B"> <tr> <td> <input type = "text" size = 5 name = "b11"></input> </td> <td> <input type = "text" size = 5 name = "b12"></input> </td> <td> <input type = "text" size = 5 name = "b13"></input> </td> <td> <input type = "text" size = 5 name = "b14"></input> </td> <td> <input type = "text" size = 5 name = "b15"></input> </td> </tr> <tr> <td> <input type = "text" size = 5 name = "b21"></input> </td> <td> <input type = "text" size = 5 name = "b22"></input> </td> <td> <input type = "text" size = 5 name = "b23"></input> </td> <td> <input type = "text" size = 5 name = "b24"></input> </td> <td> <input type = "text" size = 5 name = "b25"></input> </td> </tr> <tr> <td> <input type = "text" size = 5 name = "b31"></input> </td> <td> <input type = "text" size = 5 name = "b32"></input> </td> <td> <input type = "text" size = 5 name = "b33"></input> </td> <td> <input type = "text" size = 5 name = "b34"></input> </td> <td> <input type = "text" size = 5 name = "b35"></input> </td> </tr> </form> </table> 答え <table border = 1> <form id = "C"> <tr> <td> <input type = "text" size = 5 name = "c11"></input> </td> <td> <input type = "text" size = 5 name = "c12"></input> </td> <td> <input type = "text" size = 5 name = "c13"></input> </td> <td> <input type = "text" size = 5 name = "c14"></input> </td> <td> <input type = "text" size = 5 name = "c15"></input> </td> </tr> <tr> <td> <input type = "text" size = 5 name = "c21"></input> </td> <td> <input type = "text" size = 5 name = "c22"></input> </td> <td> <input type = "text" size = 5 name = "c23"></input> </td> <td> <input type = "text" size = 5 name = "c24"></input> </td> <td> <input type = "text" size = 5 name = "c25"></input> </td> </tr> </form> </table> </body>

  • Javascriptで自動計算の合計の式でエラー

    度々すみません。 前回こちらで質問させて頂きましたものです。 http://okwave.jp/qa/q8737139.html 教えて頂いた内容を確認してフォームの合計を表示するところまでは出来たのですが、合計する列をひとつ増設した所、D列の合計は教えて頂いた式で合計が無事表示されたのですが、C列の合計が合計ではなく文字の並びが表示されてしまいました。 色々調べてみたのですが、この現象の原因がよくわかりません。 何かエラーがあるのでしょうか。 お知恵を貸して頂けると嬉しいです。 宜しくお願いします。 ＜スクリプト＞ <script type='text/javascript'> function keisan(){ var price1 = (document.form1.a1.value) * (document.form1.b1.value) * (document.form1.c1.value); document.form1.金額1.value = price1 ; var price2 = (document.form1.a2.value) * (document.form1.b2.value) * (document.form1.c2.value); document.form1.金額2.value = price2 ; var price3 = (document.form1.a3.value) * (document.form1.b3.value) * (document.form1.c3.value); document.form1.金額3.value = price3 ; document.form1.total.value = price1 + price2 + price3; var f1 = (document.form1.c1.value); document.form1.c1.value = f1 ; var f2 = (document.form1.c2.value); document.form1.c2.value = f2 ; var f3 = (document.form1.c3.value); document.form1.c3.value = f3 ; document.form1.ctotal.value = f1 + f2 + f3; } </script> ＜HTMLソース＞ <body> <form method="post" name="form1"> <table width="473" border='1'> <tr> <td align='center'>&nbsp;</td> <td align='center'>A</td> <td align='center'>B</td> <td align='center'>C</td> <td align='center'>D</td> </tr> <tr> <td>1</td> <td><input type='text' name='a1' onchange='keisan()' style='width:50px' /></td> <td><input type='text' name='b1' onchange='keisan()' style='width:50px' /></td> <td><input type='text' name='c1' onchange='keisan()' style='width:25px' /></td> <td><input type='text' name='金額1' style='width:100px' /></td> </tr> <tr> <td>2</td> <td><input type='text' name='a2' onchange='keisan()' style='width:50px' /></td> <td><input type='text' name='b2' onchange='keisan()' style='width:50px' /></td> <td><input type='text' name='c2' onchange='keisan()' style='width:25px' /></td> <td><input type='text' name='金額2' style='width:100px' /></td> </tr> <tr> <td>3</td> <td><input type='text' name='a3' onchange='keisan()' style='width:50px' /></td> <td><input type='text' name='b3' onchange='keisan()' style='width:50px' /></td> <td><input type='text' name='c3' onchange='keisan()' style='width:25px' /></td> <td><input type='text' name='金額3' style='width:100px' /></td> </tr> <tr> <td colspan="3" align='right'>合計</td> <td><input type='text' name='ctotal' style='width:25px' /></td> <td><input type='text' name='total' style='width:100px' /></td> </tr> </table> </form> </body>

  • ラジオボタンでの表示の切替方法

    2つのラジオボタンの切替によって、表示の切替を行いたいです。 例えば、Aを選択すると(1)の入力フォームが表示され、Bを選択すると(2)が表示したいです。初期表示はAが選択された時と同じ内容となります。 <table align="center" border="0" cellpadding="0" cellspacing="0"> <tr><td><form name="Quick1"> <tr><td>選択</td> <td> <input type="radio" name="A" value="1" checked>A　 <input type="radio" name="B" value="2">B　 </td></tr> <tr> <td>(1)</td> <td> <input type="text" size="6" maxlength="5" name="text1" value="">－ <input type="text" size="6" maxlength="5" name="text2" value="">－ <input type="text" size="6" maxlength="5" name="text3" value=""> </td></tr> <tr> <td>(2)</td> <td> <input type="text" name="text7" size="43" value=""> </td></tr> </table></form></td></tr></table> すみませんが、よろしくお願い致します。

  • CFLOOPで計算させたいのですが

    今、ColdfusionでWEBの構築をしているのですが、困っています。 以下のような感じで作ってみているのですがなかなかうまくいかず悩んでいます。 (1)CFLOOPをつかって表をi行作る。 (2)その行ごとに数値を入力すると自動計算される。 (3)この場合、WEBからのinputなので、数値が入力されたら即計算させたい という感じにしたいのですが、計算されず困っています。 どなたか、よろしくお願いします。 <html> <head> <title>計算<title> </head> <b<TABLE BORDER="1" cellpadding="0"> <FORM name="myform" action="url" method="post"> <cfset text1 = 0> <cfset text2 = 0> <cfset text3 = 0> <cfset text4 = 0> <cfset text5 = 0> <cfset text6 = 0> <cfset text7 = 0> <cfloop index="i" from="1" to="10"> <TR> <TD><input type="text" name="text1" size="10" value="0"></TD> <TD><input type="text" name="text2" size="10" value=""></TD> <TD><input type="text" name="text3" size="10" value="0"></TD> <TD><input type="text" name="text4" size="12" value="0"></TD> <TD><input type="text" name="text5" size="10" value=""></TD> <TD><input type="text" name="text6" size="12" value=""></TD> <TD><input type="text" name="text7" size="10" value="0"></TD> <cfset text4=evaluate(text1 + text2 - text3)> <cfset text7=evaluate(text4 + text5 + text6)> </TR> </cfloop> </form> </TABLE> </body> </html> です、よろしくお願いします。

  • insertRowメソッド内で計算式を書く方法

    http://jsajax.com/Articles/TableInsertRow/157を参考に、[行を挿入]ボタンをクリックすると最終行の下に行が追加され、その中にテキストボックスを配置し計算を行うようにしたいと思い、下記のソースを記述しました。 そして追加した行で正常に計算を行うために、insertRow内のinnerHTMLのgoods_a_3の3の部分を動的に設定したり、calc内の計算式を動的にループさせる必要があると思ったのですが、どのように記述すれば良いか分からなかったため、アドバイスいただける方がいらっしゃいましたら、ご教示の程、よろしくお願いします。 <script type="text/javascript"> <!-- window.onload = function() { document.getElementById("btnInsert").onclick = insertRow; } function insertRow() { var tbl = document.getElementById("Table1"); var row = tbl.insertRow(2); var cell1 = row.insertCell(0); var cell2 = row.insertCell(1); var cell3 = row.insertCell(2); cell1.innerHTML = "<input type=\"text\" name=\"goods_a_3\" size=\"3\" value=\"0\" onchange=\"calc();\" />*"; cell2.innerHTML = "<input type=\"text\" name=\"goods_b_3\" size=\"3\" value=\"0\" onchange=\"calc();\" />="; cell3.innerHTML = "<input type=\"text\" name=\"ans3\" size=\"8\" value=\"0\" disabled=\"disabled\" />"; } function calc(){ document.form1.ans1.value = document.form1.goods_a_1.value * document.form1.goods_b_1.value; document.form1.ans2.value = document.form1.goods_a_2.value * document.form1.goods_b_2.value; } // --> </script> </head> <body> <form action="#" name="form1" id="form1"> <table id="Table1" border="1"> <tr> <td><input type="text" name="goods_a_1" size="3" value="0" onchange="calc();" />*</td> <td><input type="text" name="goods_b_1" size="3" value="0" onchange="calc();" />=</td> <td><input type="text" name="ans1" size="8" value="0" disabled="disabled" /></td> </tr> <tr> <td><input type="text" name="goods_a_2" size="3" value="0" onchange="calc();" />*</td> <td><input type="text" name="goods_b_2" size="3" value="0" onchange="calc();" />=</td> <td><input type="text" name="ans2" size="8" value="0" disabled="disabled" /></td> </tr> </table> </form> <br /> <input id="btnInsert" type="button" value="行を挿入" /> 以上、よろしくお願いします。

  • JavaScriptを使った計算フォーム

    JavaScriptを使った計算フォームで質問です。 人数をテキストボックスに入力し、そのあと項目を選ぶと計算がされるようにしたいのですが ラジオボタンが持っているvalueを取り出せません。 下記の「←------???」と書いてあるところを何とかすれば完成だと思うのですが、 どなたか教えていただけないでしょうか？ <script language="JavaScript" type="text/JavaScript"> function sjLeft(source,length) { if (source.length < length) { return (""); } return source.substr(0, length); } function sjReplace(source,start,length,target) { sjlen = source.length; if ((start > sjlen) || (start < 0)) { return String(""); } return String(sjLeft(source,start ) + target + source.substr(start+length, sjlen)); } function sjInsert( source, start, target) { return sjReplace(source,start,0,target); } function fcheck(obj) { s1_2value = ??? * new Number(document.form1.n1.value);　←------??? document.form1.s1_2.value = String(s1_2value); document.form1.total.value = s1_2value; return true; } </script> <form name="form1" method="POST"> <table width="400" border="1"> <tr> <td>人数</td> <td></td> <td><input type=text name=n1 size=8 onChange="fcheck(this);">人</td> <td></td> </tr> <tr> td><input name="n2" type="radio" value="13000" onChange="fcheck(this);">食事A</td> <td>\13,000</td> <td>×人数</td> <td><input name=s1_2 type=text size=8 readonly>円</td> </tr> <tr> <td colspan="2">&nbsp;</td> <td>総計</td> <td><input type=text readonly name=total size=10>円</td> </tr> </table> </form>

  • javascriptの記述方法について

    こんにちわ。 今、以下のような記述で、kei1～kei5までの合計をtotalに出そうと考えましたが、 function allcalc(){}内に書く記述で困っています。 form名を分けているのは、別の関数で各行の小計（kei1～5）を出すために分けてみましたが、あまり意味がなさそうで一つのform名に変更しようかとも思っています。 <HTML> <HEAD> <TITLE>Test</TITLE> <SCRIPT type="text/javascript"> <!-- function allcalc(total){ var al_total = 0; for (i=1; i <= 10; i++){ elementkei="total.form[" + i +"].element[2].value" if(elementkei != "") {al_total += elementkei} } document.form6.total.value = al_total; } //--> </SCRIPT> </HEAD><BODY><TABLE><FORM name="form1"> <TR><TD><INPUT type="text" name="baika1"></TD> <TD><INPUT type="text" name="suryou1"></TD> <TD><INPUT type="text" name="kei1"></TD> </FORM> <FORM name="form2"> <TR><TD><INPUT type="text" name="baika2"></TD> <TD><INPUT type="text" name="suryou2"></TD> <TD><INPUT type="text" name="kei2"></TD> </FORM> ・・・・・・・・・・・・・これが5つあります <FORM name="form6"> <TR><TD>合計</TD> <TD><INPUT type="text" name="total"> <TD><INPUT type="button" name="go" value="合計計算" OnClick="allcalc(document)"></TD> </FORM></TABLE></BODY></HTML> これを動作させてみると、「total.form[がNullかオブジェクトではありません」とエラーが流れます。 恐らく、allcalcの引数とその参照の仕方が悪いと思うのですが、 書き方を変えてみても、同じようなエラーで止まってしまいます。 どなたか方法を教えていただけないでしょうか。

  • プルダウンによる表示制御方法

    プルダウンの選択内容による表示の切り替えを行いたいです。 例えば、AとCを選択すると下にあるテキストボックスが非表示になり Bを選択するとテキストボックスが表示するように制御を行いたいです。 <table align="center" border="0" cellpadding="0" cellspacing="0"> <tr><td> <form name="a"> <SELECT NAME="b"> <OPTION SELECTED> <OPTION VALUE="0">A <OPTION VALUE="1">B <OPTION VALUE="2">C </SELECT> </td></tr> <tr><td> <input type="text" size="6" maxlength="5" name="text1" value=""> </td></tr> </form> </table></form></td></tr></table> すみませんが、よろしくお願い致します。

    • ベストアンサー
    • HTML
  • ▲▲JavaScriptに詳しい人見てください▲▲

    いつもお世話になります。 恐れ入りますがお力添えお願い致します。 フォーム（名前は f とする）を使用して、 10問の足し算問題を画面に表示して計算練習できるようにする。 問題は1～10の自然数同士の足し算とする。 各問題ごとに，問題を表示するテキストボックス（名前は p1 ～ p10 とする） 解答を入力するためのテキストボックス（名前は a1 ～ a10 とする） ○×をつけるためのテキストボックス（名前は c1 ～ c10 とする）を用意する。 答え合わせをするためのボタンと 正答数，誤答数を表示するテキストボックス（名前は ok, ng とする）を用意する。 プログラム内部では，正解を保存するための配列（変数名は sol とする）を用意し 乱数を用いて 第1問 ～ 第10問 を生成するとともに それらの正解を sol[1] ～ sol[10] に保存する。 ユーザは，解答欄（a1 ～ a10）に解答を記入し，答え合わせボタンをクリックする。 答え合わせボタンがクリックされると，各問題（iとする）について，解答欄（ai）の内容と 正解（sol[i]）の内容を照合して，正誤欄(ci)に○×をつけ，同時に正答数・誤答数をカウントする。 10問全てに○×をつけた後，正答数（ok），誤答数（ng）を表示する。 今回は，問題を作成してフォーム（テキストボックス）に表示するだけとし 答え合わせのためのコードなどは実装しない．したがって 答え合わせボタンのイベントハンドラは記述しなくて良い。 ただし，配列 sol を用意して，そこに正解を保存するところまでは作成すること。 正解を保存する配列は，（今後作成する）答え合わせボタンのイベントハンドラからも参照されるので， 変数 sol は大域変数とすること。 問題の生成には myRandom(n) 関数を用いてもよい。 と言う課題です 雛形は以下のように作りました。 <title>JavaScript Task 8-1, prototype</title> <script type="text/javascript"> <!-- /* 配列 sol は大域変数としてここで記述しておく方がよい・・？ */ /* 関数 myRandom(n) を定義するなら，このあたりでするべき・・・？ */ function initialize() { /* ここで問題を作成して p1 ～ p10 に書きこむ */ /* 各問題の正解を配列 sol に保存する */ } //--> </script> <body onload="initialize();"> <h1>計算練習プログラム (2)</h1> <form name="f" action=""> <table border="1"> <tr><td>番号</td><td>問題</td><td>解答</td><td>正誤</td></tr> <tr><td>1</td> <td><input name="p1" size="9" type="text" readonly></td> <td><input name="a1" size="3" type="text"></td> <td><input name="c1" size="3" type="text" readonly></td></tr> <tr><td>2</td> <td><input name="p2" size="9" type="text" readonly></td> <td><input name="a2" size="3" type="text"></td> <td><input name="c2" size="3" type="text" readonly></td></tr> <tr><td>3</td> <td><input name="p3" size="9" type="text" readonly></td> <td><input name="a3" size="3" type="text"></td> <td><input name="c3" size="3" type="text" readonly></td></tr> <tr><td>4</td> <td><input name="p4" size="9" type="text" readonly></td> <td><input name="a4" size="3" type="text"></td> <td><input name="c4" size="3" type="text" readonly></td></tr> <tr><td>5</td> <td><input name="p5" size="9" type="text" readonly></td> <td><input name="a5" size="3" type="text"></td> <td><input name="c5" size="3" type="text" readonly></td></tr> <tr><td>6</td> <td><input name="p6" size="9" type="text" readonly></td> <td><input name="a6" size="3" type="text"></td> <td><input name="c6" size="3" type="text" readonly></td></tr> <tr><td>7</td> <td><input name="p7" size="9" type="text" readonly></td> <td><input name="a7" size="3" type="text"></td> <td><input name="c7" size="3" type="text" readonly></td></tr> <tr><td>8</td> <td><input name="p8" size="9" type="text" readonly></td> <td><input name="a8" size="3" type="text"></td> <td><input name="c8" size="3" type="text" readonly></td></tr> <tr><td>9</td> <td><input name="p9" size="9" type="text" readonly></td> <td><input name="a9" size="3" type="text"></td> <td><input name="c9" size="3" type="text" readonly></td></tr> <tr><td>10</td> <td><input name="p10" size="9" type="text" readonly></td> <td><input name="a10" size="3" type="text"></td> <td><input name="c10" size="3" type="text" readonly></td></tr> </table> <input value="答え合わせ" type="button"><br> 正答数：<input name="ok" size="3" type="text" readonly> 誤答数：<input name="ng" size="3" type="text" readonly> </form> </body> function initialize()の中身をどうしたらいいのかが分かりません。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する