JavaScriptのsyntaxについて

2023/09/07 06:52

このQ&Aのポイント

JavaScriptを使用して任意の数の<input type='text' ..> タグを表示させる方法について質問です。
画像の上部にある「number of parts」の部分には入力する数を指定し、「inputBox()」関数を呼び出すようになっています。
しかし、入力した数だけの入力ボックスが表示されず、なぜかコメントアウトを解除して具体的な数を入力すると正常に動作します。どこが問題なのか教えてください。

ベストアンサー

javascript のsyntaxについて

2018/11/18 17:20

HTML文書でJavaScriptを使い、任意の数の<input type="text" .. > タグを表示させようとしています。添付の写真の上の方にある"number of parts" の部分が、その任意の数を入れる所で、隣のボタンを押すと関数 "inputBox()" を呼ぶようにしてあります。入力した任意の数だけwindow.document.write() で書かれた入力ボックスが出てくると思ったのですが、出てきません。 maxQty=window.document.getElementById("qty").value; によって取得した任意の数をforループで使っていますが、これが働いていないようです。　というのは、この文をコメントアウトして具体的な数を入れるとちゃんとその数だけの入力用の行が出てくるからです。どう考えてもこの文に間違いはないように思われますが、どこがおかしいのか、どなたか教えてくださいませんでしょうか。以下にソースコードをコピーします。 <!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title> makeBOMtables.html</title> <script type="text/javascript"> </script> </head> <body bgcolor="navy" style="font-size:16pt; color:yellow"> <center> <h3>company name</h3> <h2>Product BOM List making Program</h2> <form method="POST" action="makeBOMtables.php"> <table border="1"> <tr><td>product number</td> <td> description </td><td>number of parts</td><td></td></tr> <tr> <td><input type="text" size="16" style="font-size:16pt" id="prodNum" name="prodNumx"/></td> <td><input type="text" size="50" style="font-size:16pt" id="prodName" name="prodNamex" /></td> <td><input type="text" size="5" style="font-size:16pt" id="qty" name="qtyx"/></td> <td><input type="button" value="make BOM" onclick="inputBox()"></td> </tr> </table> </br> <script > var maxQty; function inputBox(){ window.document.write("<html><head></head><body bgcolor='navy' style='font-size:16pt; color:yellow'><center>"); window.document.write("<table border='1'>"); window.document.write("<tr> <th>item #</th><th>part number</th> <th>description </th><th>we need</th>"); window.document.write(" <th>we have</th> <th></br></th></tr>"); // table header maxQty=window.document.getElementById("qty").value; for (var count=1; count<=maxQty; count++){ window.document.write("<tr>"); window.document.write("<td><input type='text' size='5' style='font-size:12pt' id='item"+ count + "' name='itemx"+ count +"' value="+ count +" /></td>" ); window.document.write("<td><input type='text' size='16' style='font-size:12pt' id='partNum"+ count + "' name='partNumx"+ count +"' /></td>" ); window.document.write("<td><input type='text' size='50' style='font-size:12pt' id='partName"+ count + "' name='partNamex"+ count +"' /></td>" ); window.document.write("<td><input type='text' size='5' style='font-size:12pt' id='qtyN"+ count +"' name='qtyNx"+ count + "' /></td>" ); window.document.write("<td><input type='text' size='5' style='font-size:12pt' id='qtyH"+ count +"' name='qtyHx"+ count + "' /></td>" ); window.document.write("<td><input type='submit' value='end input'/> </td>"); window.document.write("</tr>"); }// end for window.document.write("</center></body></html>"); } </script> </form> </center> </body> </html> また、入力行が表示されるのは、なぜか別のページですが、これは今は気にしません。詳しい方がいらっしゃいましたら、よろしくお願いいたします。

papashiroSooke
お礼率90% (477/530)

JavaScript
回答数3
ありがとう数3

みんなの回答 （3）
専門家の回答

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

ベストアンサー

superside0
ベストアンサー率64% (452/698)

2018/11/19 12:20 回答No.3

> document.write()　を使わずに、同じページの下側に入力ボックスを表示するには、どんなコマンドがあるのでしょうか？フルのHTMLをいちから作るのではなく、追加したい要素のみ（今回でいうとtable部）を document.createElement(～); で作って、それを現ドキュメントに親element,appendChild(createした要素); で挿入していきます。もしjQueryが使えるのなら、$(～).append(～)　とか $(～).after(～) とかでやったほうが簡単でしょう。これ以外にも、HTMLの都合や、挿入位置の指定方法の都合に合わせていろんな方法がありますので、"JavaScript 要素　追加"でググってみて下さい。

質問者

お礼 2018/11/19 15:37

詳しい説明の入ったご回答を頂き、有難うございます。 JavaScriptはとても奥が深いのですね。近いうちにｊQueryなども勉強したいと思いますが、取りあえずはアドバイス頂いたようにdocument.createElement() を使ってやってみます。

その他の回答 (2)

superside0
ベストアンサー率64% (452/698)

2018/11/18 18:56 回答No.2

> また、入力行が表示されるのは、なぜか別のページですが、これは今は気にしません。いや、まさにそれが原因で、getElementById()に失敗しています。 document.writeした時点でドキュメントは上書きされているのでそのあとは、当ドキュメント内にid=*qty"というエレメントがなくなってしまっています。 document.writeするまえに maxQty=window.document.getElementById("qty").value; を移動させればよいのですが、そもそも元の入力フォームが消えてほしくないのなら、 document.writeを使うべきではないでしょう。

質問者

お礼 2018/11/19 01:51

早速にご回答いただき、有難うございます。とてもよくわかる説明で、document.write() を使うと今のページが上書きされることは初めて知りました。自分は、今のページはそのままで、その下に入力ボックスが表示されるものと思っていました。ではdocument.write()　を使わずに、同じページの下側に入力ボックスを表示するには、どんなコマンドがあるのでしょうか？よろしければ教えてください。自分は初心者でJavaScript は始めたばかりで、jQuery や　JSON についての知識はまだありませんが、上に書いたことを実現するのに必要ならば勉強するつもりです。

maiko04
ベストアンサー率17% (345/1956)

2018/11/18 17:45 回答No.1

ならば maxQty=window.document.getElementById("qty").value; で得られたmaxQtyを表示すれば何が表示されますか？間違いを見てもらうのではなく、自分で突き止めることをしましょう。

質問者

お礼 2018/11/19 01:34

早速の回答有難うございます。 >maxQty=window.document.getElementById("qty").value; で得られたmaxQtyを表示すれば何が表示されますか？それは自分もやってみましたが何も表示されません。＞間違いを見てもらうのではなく、自分で突き止めることをしましょう。自分でいろいろ考えた挙句に、自分では解決の糸口が見えないから質問しているわけです。そういう便利さを提供してくれているのがこのOKWAVEではありませんか？人が何でも自分で問題を解決できるのなら、こんなサイトはいらないでしょう。とにかく、あなたが回答してくれたことに対しては私はちゃんとお礼を言ったので、これ以上あなたとはかかわりたくありません。 2度と私の質問に回答しないでください。

関連するQ&A

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
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
追加、削除について
以前、行の追加と削除で質問をした者です。その時、innerHTMLでのやり方を教わりましたが appendChild、removeChildという、メソッドでも同じことができるのか教えてもらいたいです。追加ボタンを押すと左のNOが、3,4と下に増える削除ボタンを押すと戻るというやり方です。 <sample.html> <html> <head> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; CHARSET=Shift_JIS"> <title>列追加、削除</title> </head> <body> <table border=1> <col width="150" align="center" style="font-weight:bold"><col span="3"> <tr> <th >No</th> <th >列1</th> <th >列2</th> <th >列3</th> </tr> <tr> <td>1</td> <td><input type="text" name="sankou" value="" size="26" ></td> <td><input type="text" name="sankou" value="" size="26" ></td> <td><input type="text" name="sankou" value="" size="26" ></td> </tr> <tr> <td>2</td> <td><input type="text" name="sankou" value="" size="26" ></td> <td><input type="text" name="sankou" value="" size="26" ></td> <td><input type="text" name="sankou" value="" size="26" ></td> </tr> </table> <table> <tr> <td ><input type="button" VALUE="追加"></td > <td ><input type="button" VALUE="削除"></td > </tr> </table> </body> </html>
- ベストアンサー
- JavaScript
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'> </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>
- ベストアンサー
- JavaScript
javascriptを使ったPWと入力の確認
今HTMLで新規登録用のフォームを作っています。入力欄は名前、PW, PW(再確認), メールアドレス、があり、その下に送信ボタンがあります。まず、[送信]をクリックしたときに未入力や書式が違った場合はエラーを、問題が無い場合は完了画面を表示させたいです。次に、ＰＷとＰＷ（再確認）の文字列が違う場合のメッセージを出したいです。ソースはこのような感じです <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>新規登録</title> <SCRIPT TYPE="text/javascript"> Function check() { a = document.User.A.Value; b = document.User.B.Value; c = document.User.C.Value; d = document.User.D.Value; w = ""; F = ""; if (a=="") { w = "名前"; F = "A"} if (b=="" || !b.match(/^[A-z]/)) { w += "Password"; if(F == "") F = "B"} if (c=="" || !c.match(/^[A-z]/)) { w += "Password"; if(F == "") F = "C"} if (d=="" || !d.match(/^.+@.+\..+/)) { w += "メールアドレス"; if(F == "") F = "D"} f (w!="") {alert(w+"が未入力または書式が違います。"); document.User.elements[F].focus(); return false} } </SCRIPT> </head> <body onLoad="document.User.A.focus()"> <center> <br> <form method="post" action="example.cgi" name = "User"> <table style="font-size:11pt" cellpadding="2"> <tr><td></td><td style="font-size:14pt"><B>-------新規登録-------</B> <br></td></td><td></tr> <tr><td align="right">名前:</td><td><input type="text" name="A" size="40"></td> <td>(全角)</td></tr> <tr><td align="right">Password:</td><td><input type="password" name="B" size="40"></td> <td>(半角)</td></tr> <tr><td align="right">Password(再確認):</td><td><input type="password" name="C" size="40"></td> <td>(半角)</td></tr> <tr><td align="right">メールアドレス:</td><td><input type="text" name="D" size="40"></td> <td>(半角)</td></tr> <tr><td></td><td><input type="button" value="送信" onclick="return check()"></td><td></td></tr> </table> </form> </center> </body> </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">  </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()の中身をどうしたらいいのかが分かりません。
- ベストアンサー
- JavaScript
javascriptでちゃんと表示されない。
javascriptの参考書通りに書いてるのになぜか出ません。なぜか、新製品と価額だけしかでません。リラックスチェアとか価額４０００とかが出ません。何が原因かわかりません。何が原因なんでしょうか？ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title>はじめてのHTML</title> <style> table{border:solid 1px orange; border-spacing:0pc;} th,td{border:solid 1px orange; padding:4px;} </style> <script type="text/javascript"> var prod_name={'リラックスチェア','リラックスデスク','ブックスタンド'}; var prod_price ={4000,12000,800}; </script> </head> <body> <h1>新商品価額表</h1> <table> <thead> <tr><th>製品名</th><th>価額</th></tr> </thead> <tbody> <script type="text/javascript"> document.write('<tr>'); document.write('<td>'+ prod_name[0]+'</td>'); document.write('<td>'+ prod_price[0]+'</td>'); document.write('</tr>'); </script> </tbody> </table> </body> </html>
- ベストアンサー
- 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を使ったフォームをCGIで取得できない
フォームに名前、フリ仮名、性別（ラジオボタン）、生年月日（選択メニュー）があり、下記は確認ページで、javascriptを使って、表示されます。でもCGI（以下にあります）では名前のみ取得できあとの値は表示されません。どうすればよいでしょうか ---- <html lang="ja"> <head> <script type="text/javascript"> </script> </head> <body onLoad="Cng();"> <form name="kuser" action="./5-2.cgi" method="post" enctype="text/plain"> 氏名：　　　　<input type="text" name="kname" value="" size="30"><br><br> ふりがな：　<input type="text" name="kfurigana" value="" size="30"><br><br> 性別：　　　　<input type="text" name="ksex" value="" size="7"><br><br> 生年月日：　　　西暦 <input type="text" name="kyear" value="" size="10"> 年　　<input type="text" name="kmonth" value="" size="5"> 月　　<input type="text" name="kday" value="" size="5"> 日<br><br> <tr><td colspan="2" align="right"> 　　　　　　　　<input type="submit" value="送信"> 　　<input type="button" value="戻る"> ----- （CGI） #! c:/perl/bin/perl # フォームデータの取得 if($ENV{'REQUEST_METHOD'} eq 'POST') { read(STDIN, $query, $ENV{'CONTENT_LENGTH'}); } else { $query = $ENV{'QUERY_STRING'}; } foreach $pair (split(/&/, $query)){ ($key, $value)=split(/=/, $pair); $value=~tr/+/ /; $value=~s/%([0-9a-fA-F][0-9a-fA-F])/chr(hex($1))/eg; $FORM{$key}=$value; } # サーバー出力 print <<END; Content-type: text/html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html> <head><title>ふぉーむでーた</title></head> <body> <h1>フォームデータ</h1> <table border="1"> <tr><th>フォーム要素</th><th>データ</th></tr> END foreach $key (keys %FORM){ print "<tr><th>$key</th><td>$FORM{$key}</td></tr>\n"; } print <<END; </table> </body> ---
- 締切済み
- JavaScript
動的な表の計算
いつもお世話になります。見よう見まねでやっている初心者です。下記のような動的な表があります（PHPで表の行が可変します。） name="aa"に入力された値とname="bb"に入力された値の足し算の回答をname="kaito"に出したいと思っています。計算ボタンを押すとname="kaito"に答えを出したいのですが、以下のような式ですと当然ながら全く反応しません。 javascriptまたはPHPをどう記述すれば表の値を計算できるようになるのでしょうか？できれば具体的に教えて頂ければ大変助かります。ご教授の程よろしくお願い致します。 <script> function keisan(){document.tasizan.kaito.value=(document.tasizan.aa.value)+(document.tasizan.bb.value)} </script> <form name="tasizan"> <table width="100" border="1"> <tr> <th width="10" scope="col">a</th> <th width="10" scope="col">b</th> <th width="20" scope="col">回答</th> </tr> <tr> <td><INPUT type="text" name="aa" ></td><td><INPUT type="text" name="bb" ></td><td><INPUT type="text" name="kaito" ></td> <td><input type="button" value="計算" onclick="keisan()"/></td> </tr> <tr> <td><INPUT type="text" name="aa" ></td><td><INPUT type="text" name="bb" ></td><td><INPUT type="text" name="kaito" ></td> <td><input type="button" value="計算" onclick="keisan()"/></td> </tr> <tr> <td><INPUT type="text" name="aa" ></td><td><INPUT type="text" name="bb" ></td><td><INPUT type="text" name="kaito" ></td> <td><input type="button" value="計算" onclick="keisan()"/></td> </tr> <tr> <td><INPUT type="text" name="aa" ></td><td><INPUT type="text" name="bb" ></td><td><INPUT type="text" name="kaito" ></td> <td><input type="button" value="計算" onclick="keisan()"/></td> </tr> </table> </form>
- ベストアンサー
- JavaScript

JavaScriptのsyntaxについて

javascript のsyntaxについて