submitについて

前へ 次へ
このQ&Aのポイント
  • 送信２のsubmitを４回クリックすると表示が変化するが、実行方法がわからない。一回目はtext1にはtextが入り、二回目はtext1には空になる。
  • ３回目はtext1にはtexttextが入り、四回目はtext1には空になる。実行方法について教えてほしい。
  • submit２を４回クリックすると表示が変化するが、実行の仕組みが不明。一回目はtext1にはtextが入り、二回目はtext1が空になる。
回答を見る
  • ベストアンサー

submitについて

<script type="text/javascript"> <!-- function go() { document.getElementsByTagName("input")[3].value+="text"; } //--> </script> <form name="NAME1" action="#" method="get" onSubmit="go()"> <input type="submit" name="submit1" value="送信１" > <input type="submit" name="submit2" value="送信２"> <input type="button" name="submit3" value="送信3" onClick="go()"> <input type="text" name="text1" size="10"> </form> なのですが、送信２のsubmitを４回クリックすると以下のように表示されるのですが、どういう感じで実行されているのかわかりませんので教えていただけないでしょうか？ 一応一回目はtext1=textとなるのですがテキストボックスには空になります。 ２回目はtext1=textとなりテキストボックスにはtextが入ります。 ３回目はtext1=texttextとなりテキストボックスには空になります。 ４回目はtext1=textとなりテキストボックスは空になります。 以上よろしくお願いします。

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

  • ベストアンサー
  • JaneDue
  • ベストアンサー率75% (263/350)
回答No.3

最初に ・クエリが変わればファイルは同じでも別のURLとして扱われる ・action="#" は「ページの先頭へ」 これをふまえて、 ▼1回目: go()を実行(一瞬文字が見えますが)、すぐに新しいURL　 ～?submit2=送信２&text1=text#　 (のページ先頭)へジャンプします。別ページなのでtext欄は初期値で空になります。 ▼2回目: go()が実行されtext欄に追加されますが、今度はURLは同じなのでページの先頭へ移動するだけです。ページ内移動なので text欄には文字が残ったままです。 ▼3回目: go()でtext1の値がtexttextに変わったため、ジャンプ先は text1=texttextという別URLになります。別ページに移動したので当然text欄は初期値の空に戻ります。 ▼4回目: text欄がカラの状態で送信…ということは１回目と同じ処理になります。 あとはこれの繰り返し…。 formの前と後ろに<br>を沢山入れてみると挙動が少し見えやすくなるかも知れません。 尚、FireFox,Chroneで確認。IEではaction先が#だけだと再読み込み状態になり、#Ano2さんの仰るように別の状態になるようです。(ブラウザの動作としてはFireFox等が正しい)

takoyaki001
質問者

お礼

回答ありがとうございます。そういうことでしたか。わかりやすい説明ありがとうございます。FireFoxの方が正しいのですね。javascriptの勉強頑張りたいと思います。本当にありがとうございます！

その他の回答 (2)

noname#158634
noname#158634
回答No.2

うーむ。そうですね。 ＞submit は何をするのかというとフォームの送信ですよね？ ＞多分action のurlに送ると言う意味なのでしょうか？ そうです。でもactionの先が指定されていないからこのHTML自身にフォームの値を送信しています。 もちろんHTMLなので送信されたパラメータは直接はどうこうできません。 ＞一回目～四回まで送信２を押してこうなりました。 これがどうしても不思議です。本来の仕様というか私が手元で確認した際にもそんな動作はしなかったので。 質問文にない部分が影響しているかもしれません。 「どういう風に処理をするのか」というのはその謎挙動の説明を求めているという解釈でいいんであれば、もはや謎としか言いようがありません。本来なら、「送信2」を何度押してもパラメータは「?submit2=%91%97%90M%82Q&text1=text」にしかならないはずですから。 質問者さんがどういう挙動を予想していたのかを説明してくれると、その違いから始めてご希望に沿える回答ができるかも…

takoyaki001
質問者

お礼

またまた回答ありがとうございます。そうなんですか・・・今IEとfirefoxで調べてみたのですが、firefoxだとこういう風になるみたいです。IEだとtk-is-pg_1206さんの言うと通りになります。なぜでしょうか？ブラウザによって動作が違うのでしょうか？ちなみにIEの方はsubmitでテキストボックスのtextがクリアされて空になってパラメーターにはtextが表示されるで合っているのでしょうか？

noname#158634
noname#158634
回答No.1

とりあえず何がしたくてどんな挙動を期待しているのかまったく分からないから見えてる部分だけ答えますけど。 まずsubmitが「何をする」ボタンなのか分かってますか？そこからして疑問。 ＞一応一回目はtext1=textとなるのですがテキストボックスには空になります。 ＞２回目はtext1=textとなりテキストボックスにはtextが入ります。 ＞３回目はtext1=texttextとなりテキストボックスには空になります。 ＞４回目はtext1=textとなりテキストボックスは空になります。 この「text=text」ってのはパラメータのこと？だとしても、「2回目」の後に「送信3」を押さない限りこんなことにはならないので、いろいろと間違っている。 自分が書いている一つ一つのものがどういう意味なのか理解しないとプログラムもHTMLもまともには動きませんよ。

takoyaki001
質問者

お礼

回答ありがとうございます！ submit は何をするのかというとフォームの送信ですよね？ 多分action のurlに送ると言う意味なのでしょうか？ そうです。パラメーターであってます。 2回目」の後に「送信3」を押 さない限りと書いてありますが一回目～四回まで送信２を押してこうなりました。 どういう風に処理をするのか知りたくて質問しました 初心者なのですみませんが初心者でもわかりやすく説明よろしくお願いします。

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

関連するQ&A

  • テキストボックスを無効にすると値が取得できない

    javascriptでこのようにテキストボックスを無効に してフォームを送信するとphp側でvalueの値が取得できないのですが、入力無効にすると valueは送られないんでしょうか？ <form> <input type="text" id="sample" name="sample" value="値" /> </form> スクリプト .document.getElementById('sample').disabled = true; valueにはphpで値をセットし、それをテキストボックスで編集できないようにして 値を飛ばそうとしたのですがテキストボックスのvalueの値が来てないようです。 自分なりに考えたんですが、送信する瞬間だけ（submitボタンが押された時） テキストボックスを有効に戻すようにコードを書いているのですが これ以外で何かありますか？ ---このように対処--- <form onsubmit="return disb()"> <input type="text" name="sample" value="値" /> </form> スクリプト document.getElementById('sample').disabled = true; function disb(f){ f.sample.disabled = false; }

  • サブウインドウにsubmitしたい

    下記のような送信ボタンを押したときに、サブウインドウとして次の画面を開いてテキストボックスに入力した値を表示する方法についてアドバイスいただけないでしょうか。簡単かと思って探したものの、よくわかりませんでした。次の画面はnext.cgiです。送信時にFieldの値をjavascriptの値として取得する部分がよくわかりません。 ＃あくまでサブウインドウで開く ＃サブウインドウに値を引き継ぐ <FORM ACTION="next.cgi" METHOD="POST"> <INPUT TYPE="TEXT" NAME="Field" SIZE="12"> <INPUT TYPE="SUBMIT" NAME="Submit" VALUE="送信"></form>

  • 複数のsubmitボタンで押されたボタンを取得する方法

    form内の、submitボタンの値が拾えません。 １つだけsubmitボタンを設置すると値が拾えますが、 ２つ以上submitボタンを設置すると拾えません。 仕様上、無理なのでしょうか？ <SCRIPT language="JavaScript"> function move_post(){ alert(document.frmMvPost.btn.value); } </SCRIPT> <FORM name="frmMvPost" action="" method="post" onsubmit="return move_post()"> <INPUT type="submit" name="btn" value="テスト1"> <INPUT type="submit" name="btn" value="テスト2"> <INPUT type="submit" name="btn" value="テスト3"> </form>

  • submitボタンを二つ用意したい

    textに入力したものを二つのsubmitボタンで共用できるようにしたいと考えています。 作ってみたのですが、思ったように動かずに困っています。 ↓をどのように修正すれば動くでしょうか。 よろしくおねがいします。 <html> <body> <form name="hoge" action="hoge1.php" method="post"> <div class="ok_left"><input name="kw" value="" /> <script type="text/javascript"> <!-- function pushSubmit (val) { with(document.hoge){ if(val=='2'){ action = 'http://hoge.jp/hoge2.php'; } submit(); } } --> </script> <a href="javascript:pushSubmit('1');"><input name="submit1" type="submit" value="1"/></a> <a href="javascript:pushSubmit('2');"><input name="submit2" type="submit" value="2"/></a> </form> </body> </html>

    • ベストアンサー
    • HTML
  • submit()の動作について。

    <style type="text/css"> .p1{display=none;} </style> <script language="JavaScript"> function BtnNone(){ document.btn1.style.display = "none"; document.msg1.style.display = "inline"; document.frm1.submit(); } </script> </head> <form name="frm1" method="post" action="send.cgi"> <div id="btn1"> <input type="text" name="a"> <input type="submit" name="submit" value="SEND" onClick="BtnNone()"> <input type="submit" name="submit" value="BACK"> </div> <p class="p1" id="msg1">送信中</p> </form> ------------------------- 主旨が変わったので新しく質問します。 こういうソースで"SEND"をクリックするとボタンが消えて「送信中」のメッセージが表れるのですが、secd.cgiがsubmitされません。 どこが間違っているのでしょうか。 よろしくお願いいたします。

  • submitで特定の情報だけを本文にするには？

    FORMで、SUBMITを使ってメールを送るSCRIPTの場合、送信する本文を指定されたVALUEだけにすることはできないのでしょうか？ 下のようなスクリプトを書いています(以前の回答より引用しています) <script> function iSubmit() { var adress = document.myFORM.adress.value; document.myFORM.action="mailto:"+adress; document.myFORM.submit(); } </script> <FORM name="myFORM" method="post" str enctype="text/plain"> <INPUT type="text" NAME="adress"><BR> <INPUT type="text" NAME="mailtext"><BR> <INPUT type="button" VALUE="アドレス送信" onClick="iSubmit()"><BR> </FORM> submitの場合、単純に&BODY=としただけでは本文に指定出来ず困っています。 出来れば、本文に書きこまれる "mailtext="の部分も削除したいのですが、良いアイデアはないでしょうか？ <A HREF="mailto:～">で出来ないかと思ったのですが、その場合ユーザが書きこんだデータを取って来れない様な気がするので、挫折しました。 自分なりに調べたのですが、わかりません。どなたか宜しくお願い致します。

  • submitではなくbuttonで送信

    事情があり、submitではなくbuttonでフォームのデータを送信したいのですが、以下のように書くとbuttonでは4567が送信されません。 <form action="test.cgi" method="post"> <INPUT type="hidden" name="aaa" value="1234"> <INPUT type="submit" name="bbb" value="4567"> </form> ↓ <form action="test.cgi" method="post"> <INPUT type="hidden" name="aaa" value="1234"> <INPUT type="button" name="bbb" value="4567" onclick="submit();" > </form> submitと同じように、bbbのデータ4567も送信するにはどのように書けばよいのでしょうか？ 宜しくお願いします。

  • javascriptからCGIへの値渡し

    cookieは利用しない方向で考えています。 HTML上のdocument.form01.のsubmitが押下されたら一度手入力されたデータ(userinput)を加工し、 別のフォームform02.valueに格納してtest.cgiにPOSTで投げる動作を期待しています。 下記だとページ遷移無しで一時的な格納まで確認しましたが CGIへの送信が機能していないようです。 どの様にすべきでしょうか？ [html] <script type="text/javascript"> <!-- function onSubmit() { document.form02.sendform.value = '\"' + document.form01.userinput.value + '\"'; document.form02.submit(); } --> </script> <body> <form name="form02" method="POST" action="test.cgi"> <input type="hidden" name="sendform" value=""> </form> <form method="POST" action="" name="form01"> <input type="text" name="userinput"> <input type="submit" value"送信" onclick="return onSubmit();"> </form> </body> </html>

  • formのボタンをsubmitしたときにアラート

    javascript で、formのボタンをsubmitしたときに アラートが出るようにしたいと思います。 下記のように作ってみましたが、うまく動きません。 どのようにすれば動くでしょうか? ご教示いただきたくお願いいたします。 <script type="text/javascript"> function(){ $('form1').submit(function(){ $.ajax({ type: 'POST', data: postData, url: 'buy.php', success: function(data){alert("購入できました");} error: function(){alert('購入できませんでした。再度お試しください');} }); return false; }); } </script> <form name="form1" id="form1" method="POST" name="form1" value="form1" action="buy.php"> <input type="hidden" name="id" value="100" /> <input type="hidden" name="name" value="高橋" /> <input type="submit" value="Save"> <form/>

  • disabledの点で。

    このソースを開いて、更新ボタンをクリックすると、 ２の方のテキストボックスが半透明になりますが、それは半透明にしないようにすることは可能なのでしょうか。 お願いします。 <html> <head> <title></title> <script language="JavaScript"> <!-- function setTF(){ if(document.form1.text1.value=="") document.form1.text2.disabled = true; else document.form1.text2.disabled = false; } //--> </script> </head> <body> <form name="form1"> １<INPUT type="text" name="text1" onChange="setTF()"> ２<INPUT type="text" name="text2" disabled> <INPUT type="submit" value="登録" onClick="return setTF()" name="submit"> </form> </body> </html>

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

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

質問する