フォームのテキストで書かれた数字を受け取る方法とは?

このQ&Aのポイント
  • フォームのテキストで書かれた数字を受け取る方法について教えてください。
  • 具体的には、HTML内のフォームに入力された数字を取得し、別のテキスト要素に表示する方法が知りたいです。
  • また、ボタンをクリックせずにエンターキーを押すだけでフォームの内容を送信する方法も知りたいです。
回答を見る
  • ベストアンサー

■フォームのテキストで書かれた数字を受け取るにはどうすればいいのでしょうか?

HTML内で <form> <input type="text" name="a" value="a"> <input type="button" name="b" value="b" onClick="zzz()"> <input type="text" name="c" value="c"> </form> 外部JavaScript内で function zzz() {  フォームのテキストaの中に打ち込んだ数字を受け取って、テキストcの中に表示させる関数 } 上記のようなことをしたいのですが(意味がないと言われてしまえばそうです^^;)やり方を教えていただけないでしょうか? あと、フォームの内容がよくわからないので、勉強できるサイトなどありましたら教えていただけないでしょうか? 現在わかっているのは、typeが形を作るってことと、onClickがボタンを押したときのことっていうだけです。 name valueとかまったく意味不明です。 最後に、ボタンをマウスでクリックしなくてもエンターキーを押すだけでクリックしたことになる方法を教えていただければ幸いです。 よろしゅうお願いします!

  • Jack3
  • お礼率17% (153/868)

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

  • ベストアンサー
回答No.1

まずformタグに対して名前を付けて、JavaScriptからアクセスできるようにしましょう。 <form name="hoge"> … </form> 次にJavaScriptの内容です。 function zzz(){ document.hoge.c.value = document.hoge.a.value; } これでaの内容がcに表示されます(数字かどうかは無視しています)。 お勧めのサイトですが、わたしはこのサイトを使っています。 http://www.tohoho-web.com/ HTML、JavaScript、CSSなど色々載っているので参考になりますよ。

参考URL:
http://www.tohoho-web.com/

関連するQ&A

  • フォームに表示される文字をセンタリングさせたい。

    Javascriptの初心者です。宜しくお願いします。 テキストエリアが2つあったとします。 1のテキストエリアにある値を入力してボタンを押すと、 2のテキストエリアに1で入力した値をそのまま表示させ、 尚且つ表示された値をフォーム内でセンタリングさせたいのですが どうすればよいのかわかりません・・・。 ご存知の方がいらっしゃいましたら教えて下さい。 どうぞ宜しくお願い致します。 <html> <head> <script language="JavaScript"> <!-- function my1() { a=document.form1.text1.value; document.form1.text2.value=a; } //--> </script> </head> <body> <form name="form1"> <input type="texterea" name="text1"> <input type="texterea" name="text2"> <input type="button" value="CLICK!" onClick="my1()"> </form> </body> </html>

  • jqueryとテキストの取得フォーム

    フォームのラジオボックスの値を文字列としてテキストボックスに入れたいと考えています。 jqueryを使ってif分岐で長いものは書けるのですがもっとスマートにかけないかと考えています。 バリューの値を取れればと思っているのですが具体的な方法が思い浮かびません。 どなたかJQUERYが得意な方がおられましたらご教授願えませんでしょうか。 宜しくお願いします。 <script> function check1(){ $("#text1").val("Tシャツ"); } function check2(){ $("#text1").val("ロングシャツ"); } ・ ・ ・ </script> <form id="cse-search-box" action="http://google.com/cse"> <input type="hidden" name="ie" value="UTF-8" /> 袖丈 <input type="radio" name="a" onclick="check1();" value="Tシャツ" >Tシャツ <input type="radio" name="a" onclick="check2();" value="ロングシャツ" >ロングシャツ <input type="radio" name="a" onclick="check3();" value="キャミソール" >キャミソール パンツ <input type="radio" name="b" onclick="check4() value="ショートパンツ" >ショートパンツ <input type="radio" name="b" onclick="check5() value="チノパンツ" >チノパンツ <input type="radio" name="b" onclick="check6() value="ジーンズ" >ジーンズ <textarea id="text1" name="q" size="31" /></textarea> <input type="submit" name="sa" value="Search" /> </form>

  • テキストフォームのチェックについて

    テキストファームの内容チェックについて教えてください。 下記コードで取得したURLをテキストフォームに表示させ「onclick」でiframeに画面を表示させています。 これを、テキストファームが書き換わった段階で、実行することは できないでしょうか? (テキストフォーム内のURLが書き換わったら、その内容をチェック して、iframeにそのURLの画面を表示する) <html> <form name="f1"> URL:<input type="text" name="url" size="60" value="" /> <input type="button" value="このURLへ移動" onclick="target_name=***.location.href=this.form.url.value"> </form> <script type="text/javascript"> function set_latlng() { document.f1.url.value="http://***.***.****" /script> 以上、宜しくお願い致します。

  • テキスト入力フォームをクリックしなくてもアクティブに

    テキスト入力フォームをクリックしなくてもアクティブにするjavascriptを教えてください。 下のスクリプトの間違っている箇所がわかりません。 フォームタグの閉じる位置でしょうか。 <form name=frm> <input TYPE=TEXT SIZE=20> <input TYPE=Button VALUE="検索" onClick='alert("仮")'> </form> <script language=javascript> //<!-- document.frm.passch.focus(); //--> </script>

  • 複数のテキストフォームに対しての出力

    javascriptを勉強中であり、至らぬ点があるかと思いますが質問させてください。 あるhtmlページに複数のテキストフォームがあり、そこにjavascript で for 文を使い 定型文の後に追番を付加したテキストを出力(表示)させたいと思っています。 個別のテキストフォームには出力ができるのですが、複数の指定となると イマイチわかりませんでした… (正しく動作しませんでした) 私の記述が悪いとは思いますが、どのように記述すればよいでしょうか? 知見をお借りできればと思います。 よろしくお願いいたします。 【希望】 サンプル1  テスト1 サンプル2  テスト2 サンプル3  テスト3 上記 ちなみに以下が抜粋構文です。 【html】 <input type="button" value="テストボタン" onclick="myTest()">   ←ここを押すとプログラム -省略- <form name="myForm1"> サンプル1  <input type="text" size="30" name="form1" value="" readonly><br> サンプル2  <input type="text" size="30" name="form2" value="" readonly><br> サンプル3  <input type="text" size="30" name="form3" value="" readonly><br> <input type="reset" value="クリア"> </form> 【javascript】 function myTest() { for (num = 1; num <=3; num++) { // document.myForm1.form1.value = "テスト" + num ; だったら表示できる document.myForm1.form[num].value = "テスト" + num ; } } ※「form[num]」の部分が悪いとは思っていますが…

  • フォームの一部をPOSTで送信できますか?

    フォームのPOST自体をあまり理解できていないかも知れないのですが・・・ onClickイベントでJavascriptでパラメータを送信したいと思っています。 <input type="text" name="text1"> <input type="text" name="text2"> <input type="text" name="text3"> <input type="text" name="text4"> <input type="text" name="text5"> <input type="button" value="ボタン1"> <input type="button" value="ボタン2"> <input type="button" value="ボタン3"> というようなフォームがあった場合、ボタン1を押したらtext1とtext2の値を、 ボタン2を押したらtext1とtext3の値を・・・という風に 送信する内容を変えたいのですが、それをPOSTで渡すことは可能なのでしょうか? ちなみに送信したい内容は、ボタンが違っても重なっているものもあります。 また可能であれば、どう記述すればよろしいでしょうか?(NNです) よろしくお願いします。

  • フォームボタンのvalueを渡すにはどうしたらいいのでしょうか?

    下記のソースのように「word」というテキストフィールドの 入力チェック後ボタンのvalueをword.phpに渡したいのですがどのようにしたらいいのでしょうか? 入力チェックをせず input type="button"ではなくinput type="submit" にするとword.phpに渡せるのですが・・・ ようはA、B、Cそれぞれのボタンを押した時で word.phpでbtnのvalueをPOSTで受け取り 処理をvalue A、B、Cで分岐させたいんです。 よろしくお願いします。 <html> <head> <SCRIPT language="JavaScript"> <!-- function chk(chkfrm){ var tmp = chkfrm.word.value.length; if(tmp > 50 ){ alert("文字数が多すぎます"); } else{ chkfrm.submit(); } } //--> </SCRIPT> </head> <body> <form name="form" method="post" action="word.php"> <input name="word" type="text" id="word"> <input type="button" name="btn" value="A" onclick="chk(this.form);"> <input type="button" name="btn" value="B" onclick="chk(this.form);"> <input type="button" name="btn" value="C" onclick="chk(this.form);"> </form> </body> </html>

  • Javascriptsによるテキストフィールド上の数字のインクリメントについて

    お世話になります。 現在やっているゲーム中に使うカウンターとロガーを作成することを思い立ち、HTML+PHP+MySQLにてWebの作成を開始したのですが、その入力フォームを便利にしようとしてちょと詰まってます。 フォーム内容としては テキストフィールド インクリメントボタン デクリメントボタン テキストフィールド インクリメントボタン デクリメントボタン テキストフィールド インクリメントボタン デクリメントボタン サブミットボタン という形で作成しておりまして テキストフィールドには数字を入力しますがその右側にボタンを設けてそのボタンでも数字を操作できるようにしたいのでjavascriptに手を出したのですが、どうにも上手く動かせません。 質問に文字数制限がきついのでちょと簡略化させてもらいまして <script type="text/javascript"><!-- function increment(i) { document.testform.elements["text"+i].value = eval(document.testform.elements["text"+i].value) + 1 } // --></script> </head> <body> <FORM name="testform"> <input type="text" name="text1" value=0><br> <input type="button" value="1" onClick="increment(1)"><br> </FORM> 上記では動くのですが最後のonClick=の後をできればダイレクトに"increment(text1)"にしたく色々いじっているのですがどうにも上手くいきません。 何かアドバイスを頂けないかと思うのですがいかがでしょうか。 よろしくお願いいたします。 また1のインクリメントだけではなく3増やすボタンも同時につけたいと思いますが、こちらのtipsもありましたらお教え頂きたく思います。

  • フォームに入力された値を計算する方法

    私はまったくの初心者なのですがどなたか教えて下さい。 ●A,B,Cという3つの入力フォームがあるとします。 Aのフォームに入力された数字は「A÷20」という値に、 Bのフォームに入力された数字はそのまま、 Cのフォームに入力された数字は「C×10」という値に変更して、 (A+C)÷B×30という計算を行なって、その答えを Dのフォームへ表示するというシステムをcgiやphpで作りたいのです。 あれこれと試行錯誤しながら、javascriptでなんとか出来たんですが… どなたか教えて頂けませんか? function keiri() { a = document.takeko.case.value; a = eval(a); a = a / 20 b = document.takeko.time.value; b = eval(b); c = document.takeko.days.value; c = eval(c); c = c * 10 ans = (a + c) / c * 30; document.spec.result.value = ans; } <form name="takeko"> <input name="case" type="text" size="12"> <input name="time" type="text" size="12"> <input name="days" type="text" size="12"> <input name="button" type="button" onClick="keiri()" value="CLICK"> <input name="result" type="text" size="12"> <br></form>

    • 締切済み
    • PHP
  • 2つのフォームに値を入れて計算

    2つのフォームを作り、その2つを計算したいのですがオブジェクトの指定の仕方がエラーが出てしまい(オブジェクトを指定してくださいと出ます)わかりません。 どうか教えてください。 ちなみに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>