JavaScriptの計算練習プログラムを作成する方法
- JavaScriptを使用して、計算練習プログラムを作成する方法について説明します。
- フォームを使用して、10問の足し算問題を表示し、解答と正誤を入力するためのテキストボックスを用意します。
- 正解を保存する配列を準備し、答え合わせボタンのイベントハンドラから参照できるようにします。
- ベストアンサー
▲▲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()の中身をどうしたらいいのかが分かりません。
- hideyuki-man
- お礼率42% (121/287)
- JavaScript
- 回答数4
- ありがとう数1
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
var node = document.getElementById ('test'); 例えば、これは１つのノードを返す var input = document.getElementsByTagName ('input'); これだと、document にあるすべての input 要素を返す。つまりこれは、複数のノードを返している なので、課題の中の、input 要素の名前 p1から p10 までは、name を p とだけにし、以下のように集めればよかったのだ。 var p = document.forms['f'].getElementsByName ('p'); ここで、p.length は、10を返す。 プログラムのどこかで、１１番目の input要素で、name ="p" を追加したとしよう (node.appendChildなどを利用して) すると p.length は、自動的に11を返すようになる。なのでこのgetElementsByName の戻り値は「生きたノードリスト」を返す。 これとは別に querySelectorAll は「死んだノードリスト」を返す。追加しても lengthの値は増えない var p = document.querySelectorAll ('form[name="f"] input[name="p"]');
その他の回答 (3)
- babu_baboo
- ベストアンサー率51% (268/525)
貴方に与えられた課題だからね、まともに答えては勉強を阻害してしまうと思って、あえて習わないであろう方法をとりました。でもいずれそんな形に近づくと思うよ。 どうやって、input 要素の name が p1 から p10 まで集める？ var input = []; var es = document.forms['f'].elements; for (var i = 1; i <= 10; i++) input.push (es['p' + i]); これが、１行で済む。上は配列だけど、下はノードリストを返す。 var input = document.querySelectorAll ('form[name="f"] input[name^="p"]'); 配列ならば、これで済むけど、 input.forEach (function (e) {～ ノードリストなら、こうなる。 Array.prototype.forEach.call (input, function (e) {～ ところで提出期限は過ぎましたか？
補足
なんども何度もありがとうございます。 とりあえずは提出が出来ましたっ！ ノードリストとは何でしょうか？
- babu_baboo
- ベストアンサー率51% (268/525)
Firefox だけにとっかしないようにしました。ふるいIEはむりですが、めじゃーなぶらうざならうごくとおもいます。ぜんかくくうはくははんかくにして！ var hoge = { 'start' : (function () { Array.prototype.forEach.call (this.p, function (_, i) { this.p[i].value = (Math.random () * 10 + 1 |0) + ' + ' + (Math.random () * 10 + 1 |0); this.a[i].value = this.c[i].value = ''; }, this); this.o.value = this.n.value = ''; }), 'handleEvent' : (function (event) { for (var i = 0, ok = 0, ng = 0, p; p = this.p[i]; i++) { eval ('var f =(' + this.p[i].value + ')==' + (this.a[i].value || '""')); (f) ? (this.c[i].value = '○', ok++): (this.c[i].value = '×', ng++) } this.o.value = ok; this.n.value = ng; }), 'demo' : (function () { var f = document.querySelector ('form'); this.p = f.querySelectorAll ('table input[name^="p"]'); this.a = f.querySelectorAll ('table input[name^="a"]'); this.c = f.querySelectorAll ('table input[name^="c"]'); this.o = f.querySelector ('input[name="ok"]'); this.n = f.querySelector ('input[name="ng"]'); f.querySelector ('input[type="button"][value="答え合わせ"]') .addEventListener ('click', this, false); this.start (); }) }; function initialize() { hoge.demo (); }
補足
Array.prototype.forEach.call～とか、初めて見るものだらけでした！笑 new.Array～やdocument.フォーム名.elements["部品名"].valueを習ったんですが、 それではこのプログラムは動かせないですかね＞＜ new.Arrayやdocument.フォーム名.elements["部品名"].valueを使える方法はお聞きしたいです(´・ω・｀)
- babu_baboo
- ベストアンサー率51% (268/525)
さんこうにもならないね。Firefox とかなら、みじかくかけるよ <!DOCTYPE html> <title>JavaScript Task 8-1, prototype</title> <script type="application/javascript; version=1.8"> var sol; function initialize() { sol = Array.prototype.map.call ( document.querySelectorAll ('form[name="f"] table input[name^="p"]'), (function (e) let (q1 = Math.random () * 10 + 1 |0, q2 = Math.random () * 10 + 1 |0) (e.value = q1 + "+" + q2, q1 + q2))); } </script> いかHTMLを
関連するQ&A
- 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>
- ベストアンサー
- JavaScript
- ２つのフォームに値を入れて計算
２つのフォームを作り、その２つを計算したいのですがオブジェクトの指定の仕方がエラーが出てしまい(オブジェクトを指定してくださいと出ます)わかりません。 どうか教えてください。 ちなみに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>
- ベストアンサー
- JavaScript
- ▲▲JavaScriptに詳しい人見てください▲▲
一度に出題される10問が全て異なる問題になるような計算練習プログラムをつくる課題がでました＞＜ ・ 問題作成時，正解だけではなく問題も保存するようにする． （保存のしかたにはさまざま形がある．どのような形でもよい．） ・ 新たに問題を作成したとき，保存されている「既に存在している (出題されている) 問題」と比較し， 同じものがあれば (新しいものになるまで) 作り直す． というヒントがあります・・ 一度書いてみましたが・・ <title>計算練習プログラム(3)</title> <h1>計算練習プログラム (3)</h1> <form name="f"> <table border> <tr><td>番号</td><td>問題</td><td>解答</td><td>正誤</td></tr> <script type="text/javascript"> <!-- // 変数・関数の定義． var i, n, m; n = new Array(11); m = new Array(11); var questions = new Array(); //問題の組み合わせを記録する function myRandom(n) { return Math.floor(Math.random() * n); } for(i=1; i<=10; i++){ do { n[i] = myRandom(10) + 1; m[i] = myRandom(10) + 1; }while( questionCheck(n[i],m[i]) ) document.writeln('<tr><td>' + i + '</td><td>' + n[i] + ' + ' + m[i] + ' =</td>'); document.writeln(' <td><input type="text" name="a' + i + '" size="3"></td>'); document.writeln(' <td><input type="text" name="c' + i + '" size="3" readonly></td></tr>'); } function check() { var i, ok=0, ng=0; // i: for の制御変数, ok: 正答数, ng: 誤答数． for (i=1; i<=10; i++) { if (Number(document.f.elements["a" + i].value) == n[i]+m[i]) { document.f.elements["c" + i].value = "○"; ok++; } else { document.f.elements["c" + i].value = "×"; ng++; } } document.f.ok.value = ok; document.f.ng.value = ng; } function questionCheck(n,m) { //問題が被っていたらtrueを返す var i; //i:ループ用 var mn = ""+n+m; //mn:nとmを文字列にしたもの for(i=0;questions[i]!==undefined;i++) { if(mn == questions[i]) { //問題が被ったら return true; } } questions[i] = mn; return false; } // --> </script> </table> <input type="button" value="答え合わせ" onclick="check();"> <!-- イベントハンドラ check() を呼び出す．--> 正答数：<input type="text" name="ok" size="3" readonly> 誤答数：<input type="text" name="ng" size="3" readonly> </form> 先生からのコメントは ＞一応できていますが，せっかく，n, m を配列にして，問題の数値を保存するようにしたのに，別途 questions を用意して，そちらを使うようにしているので，ややちぐはぐな印象を受けます． ということでした・・ n, m を配列にして、問題の数値を保存するようにして、そのあとどうしたらいいのでしょうか よろしくお願い致しますっ
- ベストアンサー
- JavaScript
- 再度読み込みは出来ないのでしょうか？
各テキストボックスに値を入れて、 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
- selectでinputの表示を変えたい
セレクトを選択した時に、inputの一部をdisabledにし、同時にinputの背景色を変更したいと思っています。 ----------------------------------------------------------------------- 現在はこんな感じです。 function menuLink(linkLoc) { if(linkLoc !="") { ifrm.location.href=linkLoc;} } --- セレクト１ <SELECT style="WIDTH: 130px" onchange="menuLink(this.options[this.selectedIndex].value)"> <OPTION value="11.html">1</OPTION> <OPTION value="22.html">2</OPTION> <OPTION value="33.html">3</OPTION> セレクト２ <SELECT style="WIDTH: 130px" onchange="menuLink(this.options[this.selectedIndex].value)"> <OPTION value="44.html">1</OPTION> <OPTION value="55.html">2</OPTION> <OPTION value="66.html">3</OPTION> セレクト３ <SELECT style="WIDTH: 130px" onchange="menuLink(this.options[this.selectedIndex].value)"> <OPTION value="77.html">1</OPTION> <OPTION value="88.html">2</OPTION> <OPTION value="99.html">3</OPTION> (実際にはもっと多くのセレクトがあります) <TR> <TD><INPUT type="text" name="aa" size="10" maxlength="2"></TD> <TD><INPUT type="text" name="ba" size="10" maxlength="2"></TD> <TD><INPUT type="text" name="ca" size="10" maxlength="2"></TD></TR> <TR> <TD><INPUT type="text" name="ab" size="10" maxlength="2"></TD> <TD><INPUT type="text" name="bb" size="10" maxlength="2"></TD> <TD><INPUT type="text" name="cb" size="10" maxlength="2"></TD></TR> <TR> <TD><INPUT type="text" name="ac" size="10" maxlength="2"></TD> <TD><INPUT type="text" name="bc" size="10" maxlength="2"></TD> <TD><INPUT type="text" name="cc" size="10" maxlength="2" /></TD></TR> <TR> <TD><INPUT type="text" name=da readOnly value=0 size=10></TD> <TD><INPUT type="text" name=ea readOnly value=0 size=10></TD> <TD><INPUT type="text" name=fa readOnly value=0 size=10></TD></TR> <TR> <TD><INPUT type="text" name=db readOnly value=0 size=10></TD> <TD><INPUT type="text" name=eb readOnly value=0 size=10></TD> <TD><INPUT type="text" name=fb readOnly value=0 size=10></TD></TR> <TR> <TD><INPUT type="text" name=dc readOnly value=0 size=10></TD> <TD><INPUT type="text" name=ec readOnly value=0 size=10></TD> <TD><INPUT type="text" name=fc readOnly value=0 size=10></TD></TR> ----------------------------------------------------------------------- セレクト１のどれかを選択した時に、インプットのaa,ba,da,eaをdisabledにし、同時にaa,ba,da,eaの背景色を変更 セレクト２のどれかを選択した時に、インプットのab,bb,db,ebをdisabledにし、同時にab,bb,db,ebの背景色を変更 という感じにしたいのですが、可能でしょうか？ 可能であれば書き方を教えていただけると助かります。 よろしくおねがいします。
- 締切済み
- JavaScript
- JavaScriptの質問です。
JavaScriptの質問です。 下記フォームで、 １番が入力されると、 ２、３番目のエリアがグレーになって入力不可になる方法を教えてください。 <tr> <th align="right">1番</th> <td><input type="text" size="10" name="shopid" id="shopid" /></td> </tr> <tr> <th align="right">2番</th> <td><input type="text" size="10" name="area" /></td> </tr> <tr> <th align="right">3番</th> <td><input type="text" size="10" name="business" /></td> </tr> <tr> よろしくお願いします。
- ベストアンサー
- JavaScript
- 計算の結果が出るようにしたいのですが・・・
title>JavaScript Task 9-1pre</title> <h1>計算練習プログラム (2)</h1> <form name="f"> <table border> <tr><td>番号</td><td>問題</td><td>解答</td><td>正誤</td></tr> <script type="text/javascript"> <!-- // 変数・関数の定義 var i, n, m,sol,ans; // for の制御変数, 問題 new Array// 正解を保存する配列を用意する // (配列用の変数を宣言し，配列オブジェクトを作ってその変数に代入する) function myRandom(n) { // 0 ～ n-1 の乱数を返す関数 return Math.floor(Math.random() * n);} // 「答え合わせ」ボタンのイベントハンドラ function check() { var i,t,f,ans; // 変数の宣言．反復の制御変数iと，正答数・誤答数を数える変数(初期値0)を含む for(i=1; i<=10; i++){// 以下を10回反復 (i = 1 ～ 10) document.f.si.value if(ans == sol); document.f.ci.value("○"); i+1; // 第i問の解答(ユーザーの入力)が(配列に保存した)第i問の正解と一致した場合 // 第i問の正誤欄に○を表示 // 正答数に1加える else(ans== sol); document.f.ci.value;("×"); i+1;} // そうでない(正解と一致しなかった)場合 // 第i問の正誤欄に×を表示 // 誤答数に1加える // 反復パートの終わり // 正答数・誤答数の表示 for(i=1; i<=10; i++){ // 第i問の問題の作成 n = myRandom(10) + 1; m = myRandom(10) + 1; n + m = sol; if (ans==sol) else if // 第i問の正解を(用意した配列に)保存 i = new Array(11) for(1=1; 1<=10; i++) i[1] = n + m; i[2] = n + m; i[3] = n + m; i[4] = n + m; i[5] = n + m; i[6] = n + m; i[7] = n + m; i[8] = n + m; i[9] = n + m; i[10] = n + m // 第i問の問題等の表示 (B-2) document.writeln('<tr><td>' + i + '</td><td>' + n + ' + ' + m + ' =</td>'); document.writeln(' <td><input type="text" name="s' + i + '" size="3"></td>'); document.writeln(' <td><input type="text" name="c' + i + '" size="3" readonly></td></tr>'); } // --> </script> </table> <input type="button" value="答え合わせ" onclick="check();"> 正答数：<input type="text" name="ok" size="3" readonly> 誤答数：<input type="text" name="ng" size="3" readonly> </form> ここまで作ってみました。 はじめまして。chiaken22と申します。 ここで行き詰ってしまいました。 もしかしたら間違っているかもしれません。 //のあとはどうすればよいかを書いたものなのですが、 なかなかわからなくて困っています。 間違っている場合は指摘していただきたいです。 正解でなくてもヒントでもよいので教えてください。 すみません。 よろしくお願い致します。
- 締切済み
- JavaScript
- ラジオボタンでの表示の切替方法
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> すみませんが、よろしくお願い致します。
- ベストアンサー
- JavaScript
- VBAでWebページに入力&ボタンクリック
URLがhttp://xxx.com/のページで次のようなフォームのときExcelで自動入力クリックするマクロを作りたいです。 <input type="hidden" name="room" value="aaaaa"/> <a name="regist" id="regist">総登録数</a> <table width="402" border="1"> <tr> <th align="center" colspan="2"><div align="left"><big>登録ページ</big></div></th> </tr> <tr> <td colspan="2"> name <input type="text" size="20" name="name" value="" maxlength="20"> Email <input type="text" size="20" name="email" value=""> </td> </tr> <tr> <td align="center">pass</td> <td><input type="text" size="20" name="pw" maxlength="12" value=""></td> </tr> <tr> <td align="center">category</td> <td><select size="1" name="junle"> <option value="pp" selected="selected">カテゴリ選択</option> <option value="0">その１</option> <option value="1">その２</option> </select></td> </tr> <tr> <td align="center">title</td> <td><input type="text" size="55" name="title" maxlength="25" value=""></td> </tr> <tr> <td align="center">URL</td> <td><input type="text" size="55" name="url"></td> </tr> <tr> <td align="center">intro</td> <td><input type="text" name="comment" size="55" maxlength="50" value=""></td> </tr> <tr align="center"> <td><br></td> <td><input type="submit" name="mode" value="登録"> <input type="reset" value="クリア"></td> </tr> </table> 入力する内容は１行目のA,B,C・・にname,email,pass・・・が順番にそれぞれ入っています。
- ベストアンサー
- オフィス系ソフト
- 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"> </td> <td>総計</td> <td><input type=text readonly name=total size=10>円</td> </tr> </table> </form>
- ベストアンサー
- JavaScript
お礼
難しいけど わかりました☆ ありがとうです♪