Fieds_labo1
html-フォーム送信制御
最終更新:
fieds_labo1
-
view
「onsubmit this.onsubmit function return false」の検索結果
「html-フォーム送信制御」
から
次の単語がハイライトされています :
- 「onsubmit」を@wiki全体で検索
- 「this.onsubmit」を@wiki全体で検索
- 「function」を@wiki全体で検索
- 「return」を@wiki全体で検索
- 「false」を@wiki全体で検索
html フォーム送信制御
IE70573013とFireFox20014での送信の違い
Enterで送信
(1)Submitボタン無しで、1個のテキストフィールドでEnter
- IE7:テキストのValueを返す。
- FFox2:テキストのValueを返す。
(2)(1)で隠しフィールドを1個追加して、1個目のテキストフィールドでEnter
隠しフィールド
<input type="text" name="dummy" style="position:absolute;visibility:hidden">
隠しフィールド
<input type="text" name="dummy" style="position:absolute;visibility:hidden">
- IE7:送信しない。
- FFox2:送信しない。
Enter抑止
(1)簡単抑止、制限あり。
<form name="..." action="..." onSubmit="return false" method="POST">
ただし、ボタンnameでvalueを期待できない。標準Submitボタン参照の事。
(2)キーコード判別して抑止。(他にも例はいろいろ見つかる。大体関数になってる)
<form name="..." action="..." onSubmit="return false" method="POST">
ただし、ボタンnameでvalueを期待できない。標準Submitボタン参照の事。
(2)キーコード判別して抑止。(他にも例はいろいろ見つかる。大体関数になってる)
if(event.keyCode==13){ if(window.event.srcElement.type!='submit' && window.event.srcElement.type!='textarea'){ return false; } }
2重送信抑止
(1)単純抑止
onsubmit="this.onsubmit=function(){return false}"
(2)送信ボタンをdisable
送信ボタンをdisableにするので、当然その送信ボタンに定義したvalueは送られない。
別途hiddenを用意してvalueを入れる。
onsubmit="this.onsubmit=function(){return false}"
(2)送信ボタンをdisable
送信ボタンをdisableにするので、当然その送信ボタンに定義したvalueは送られない。
別途hiddenを用意してvalueを入れる。
標準Submitボタン
(1)1フォーム内にSubmitボタン2個
- IE7:それぞれのSubmitボタンのValueを返す。
- FFox2:それぞれのSubmitボタンのValueを返す。
(2)(1)で、テキストフィールドでEnter
- IE7:Value無し。NULL
- FFox2:先に定義したSubmitボタンのValueを返す。
(3)(1)で、Actionをシャープにして、ボタン押しまたはENTER。
- IE7:405
- FFox2:405
(4)(1)で、隠しフィールドと onsubmit="return false;" を追加して、テキストフィールドでEnter
- IE7:送信しない。ボタンを押しても送信しない。完全抑止。
- FFox2:送信しない。ボタンを押しても送信しない。完全抑止。
(5)(4)で隠しフィールド無し。
- IE7:送信しない。ボタンを押しても送信しない。完全抑止。
- FFox2:送信しない。ボタンを押しても送信しない。完全抑止。
(6)(5)でSubmitボタンに onclick="submit();" を追加して、テキストフィールドでEnter
- IE7:送信しない。ボタンを押すとテキスト内容を送信し、ボタンvalueは無し。
- FFox2:テキスト内容を送信、ボタンvalueは無し。ボタンを押しても同様。
(7)Submitボタンのスタイル変更。ボタン内のvalue文字をどう消してみせるかがポイント。
style="width:300px;height:20px;background-image:url('b1.gif');
color:#ff66cc;font-size:20px;border-style:none;background-color:#ffffff;"
style="width:300px;height:20px;background-image:url('b1.gif');
color:#ff66cc;font-size:20px;border-style:none;background-color:#ffffff;"
汎用ボタン
(1)1フォーム内に汎用ボタン2個
- IE7:押しても何もしない。
- FFox2:押しても何もしない。
(2)(1)で、テキストフィールドでEnter
- IE7:Value無し。NULL
- FFox2:Value無し。NULL
(3)(1)で、Actionをシャープにして、ボタン押しまたはENTER。
- IE7:Enterで405
- FFox2:Enterで405
(4)(1)で、onsubmit="return false;" を追加して、テキストフィールドでEnter
- IE7:送信しない。ボタンを押しても送信しない。完全抑止。
- FFox2:送信しない。ボタンを押しても送信しない。完全抑止。
(5)(4)で汎用ボタンに onclick="submit();" を追加して、テキストフィールドでEnter
- IE7:テキストは送信、ボタンvalue無し。
- FFox2:テキストは送信、ボタンvalue無し。
イメージボタン
イメージボタンは本来、ボタンイメージのxy座標を返すためのもの。
(1)1フォーム内にイメージボタン2個
(1)1フォーム内にイメージボタン2個
- IE7:ボタンvalue無し。
- FFox2:それぞれのイメージボタンのValueを返す。
(2)(1)で、テキストフィールドでEnter
- IE7:Value無し。NULL
- FFox2:先に定義したSubmitボタンのValueを返す。
(3)(1)で、Actionをシャープにして、ボタン押しまたはENTER。
- IE7:405
- FFox2:405
(4)(1)で、隠しフィールドと onsubmit="return false;" を追加して、テキストフィールドでEnter
- IE7:送信しない。ボタンを押しても送信しない。完全抑止。テキストフィールドでEnterを押すとカーソル枠がボタンに移動する。
- FFox2:送信しない。ボタンを押しても送信しない。完全抑止。
(5)(4)で隠しフィールド無し。
- IE7:送信しない。ボタンを押しても送信しない。完全抑止。(4)と違い、テキストフィールドでEnterを押してもカーソル枠がボタンに移動しない。
- FFox2:送信しない。ボタンを押しても送信しない。完全抑止。
(6)(5)でイメージボタンに onclick="submit();" を追加して、テキストフィールドでEnter
- IE7:送信しない。ボタンを押すとテキスト内容を送信し、ボタンvalueは無し。
- FFox2:テキスト内容を送信、ボタンvalueは無し。ボタンを押しても同様。
(7)(6)でテキストフィールド無し。
- IE7:ボタンを押すと送信し、ボタンvalueは無し。
- FFox2:ボタンを押すと送信し、ボタンvalueは無し。
(8)(7)に<input type="hidden" name="dummy" value="">を追加
- IE7:ボタンを押すと送信し、ボタンvalueは無し。
- FFox2:ボタンを押すと送信し、ボタンvalueは無し。
(9)(8)でボタンを押すと隠しテキストに値を設定するように変更。
- IE7:ボタンを押すと送信し、設定したテキスト内容を返す。ボタンvalueは無し。
- FFox2:ボタンを押すと送信し、設定したテキスト内容を返す。ボタンvalueは無し。
(10)(9)で、テキストフィールドを追加してEnter =>(6)?
- IE7:Enterでは送信しない。ボタンを押すと送信し、設定したテキスト内容を返す。
- FFox2:Enterで送信し、先に定義したボタンの設定値を返す。ボタンを押すとボタン設定値を返す。
(11)(10)にテキストフィールドを追加して、入力フィールドを2個にし、Enter
- IE7:Enterで送信し、先に定義したボタンの設定値を返す。ボタンを押すとボタン設定を返す。
- FFox2:Enterで送信し、先に定義したボタンの設定値を返す。ボタンを押すとボタン設定を返す。
まとめ
- 送信制御する場合は、form部品のボタンは使わない。画像を貼って、onclickでsubmitする。
- 複数個のボタンによる値切替は別途hidden項目を作り、送信時に設定する。
- Enterはガード。
- 2重送信は保留(disableにすると逆に混乱する?)。
- javaが無いと動かない。javaが切ってあるときは送信不可。