|
とても不思議な現象…。
====
print "<form action="addcomment.html" method="post">n";
print "<input type="text" />n";
print "<input type="button" value="test" onclick="this.disabled=true;this.form.submit();" />n";
print "</form>n";
====
これで<input type="text"のとこでのエンターキーがsubmitされてしまう。
(しかも、どのブラウザでも同じ挙動)
実はこれ、<input type="text"の次に
<input type="text" />をもう一つ書いてやると起こらない…。
(passwordでもよかった。ボタン系やtextareaではダメ)
今までいくつかの入力があったから気付かなかった。
(一つの入力の場合はformが勝手にsubmitするのかな?)
で、解決方法は、
====
print "<script LANGUAGE=JavaScript>n";
print "<!--n";
print "var clicked=false;n";
print "// --></script>";
print "<form action="addcomment.html" method="post" onSubmit="return clicked;">n";
print "<input type="text" />n";
print "<input type="reset" />n";
print "<input type="button" value="test" onclick="clicked=true;this.form.submit();" />n";
print "</form>n";
====
↑「エンターキー無効」とかで調べると、こんなのが検索して出てきた…。
フォームがsubmitしないようにして、ボタンクリックした時だけだから、こうかな?
====
print "<form action="addcomment.html" method="post" onsubmit="return false;">n";
print "<input type="text" />n";
print "<input type="reset" />n";
print "<input type="button" value="test" onclick="this.disabled=true;this.form.submit();" />n";
print "</form>n";
====
よし、キチンと動いた。
ポイントは
・formタグに、onsubmit="return false;"を入れて通常のsubmitを無効化
・inputタグのtypeがsubmitでなくてbutton
・this.disabled=true;はクリックされた瞬間無効にして多重送信をさせない
あと、確認ダイアログを入れるのはonclickの所で、
if(window.confirm('よろしい?')){Cal.disabled=true;Cal.form.submit();}
とするだけ。
ちなみにこの方法では、
<input type="button" name="hoge" id="hoge"での『hoge』がPOSTされないので、数種類のボタンを使ってる場合には注意。
~~~~
javascriptを使って色々やりつつあります。
他の記事もどうぞ…。
※ 『javascript』に繋がる関連物を 視覚的に探しだせるサイトを作ってみました(よろしければクリックしてみてくださいね)。
リンク元:
(2) : http://www.google.co.jp/search?hl=ja&q=form+enter+%E7%84%A1%E5%8A%B9&sourceid=navclient-ff&rlz=1B6_____jaJP349JP350&ie=UTF-8&aq=1&oq=form+enter
(1) : http://search.yahoo.co.jp/search?p=javascript+text+enter&ei=UTF-8&fr=top_ga1_sa&x=wrt
(1) : http://www.google.co.jp/search?hl=ja&lr=&q=javascript+form+post&start=10&sa=N
(1) : http://www.google.co.jp/search?hl=ja&q=javascript+%E3%82%A8%E3%83%B3%E3%82%BF%E3%83%BC%E3%82%AD%E3%83%BC+%E7%84%A1%E5%8A%B9+%E3%83%95%E3%82%A9%E3%83%BC%E3%83%A0&lr=&aq=f&oq=
(1) : http://www.google.co.jp/search?hl=ja&lr=&client=firefox-a&channel=s&rls=org.mozilla:ja:official&hs=ess&q=Enter%E3%80%80Submit%E3%80%80MAC&start=10&sa=N
(1) : http://www.google.co.jp/search?sourceid=navclient&aq=2&oq=form+enter&hl=ja&ie=UTF-8&rlz=1T4ADBF_jaJP278JP280&q=form+enter%e3%82%ad%e3%83%bc+%e7%84%a1%e5%8a%b9
(1) : http://search.yahoo.co.jp/search?p=javascript+form+%E9%80%81%E4%BF%A1&ei=UTF-8&fr=top_ga1_sa&x=wrt
(1) : http://www.google.co.jp/search?q=form+action+Enter%E3%82%AD%E3%83%BC&btnG=%E6%A4%9C%E7%B4%A2&hl=ja&lr=&sa=2
(1) : http://www.google.co.jp/search?q=javascript+onclick+%E3%82%AD%E3%83%BC&lr=lang_ja&ie=utf-8&oe=utf-8&aq=t&rls=org.mozilla:ja:official&client=firefox
(1) : http://www.google.com/search?q=form+onsubmit+13+enter&btnG=%E6%A4%9C%E7%B4%A2&hl=ja&lr=lang_ja&client=safari&rls=en&sa=2
ページ閲覧者数:70人
[ javascript ] 一覧へ
|