
#過去ログをあたりましたが、自分で納得いく解答がなかったので質問します。
フォームのsubmitボタンにonClickでチェッカーなどの関数を与えた場合、
submitでフォーム内容を送信するのと、onClickで指定されている関数の
どちらが先に処理されるのでしょうか。
(一応、WindowsのIE、ネスケ共々、onClickの処理の後、submitされるようではあります)
function tasikame {
(フォームの内容チェック/中略)
alert("入力されていない項目があります")
}
例えば、このような関数をonClickで起動する場合、フォームに入力されていない
項目があると、警告されます。
この時、submitはどの環境でも起動しないで終わるのでしょうか。
それとも警告が起動した後、フォーム内容はsubmitされてしまうのでしょうか。
#分かりづらければ、補足しますのでどうぞよろしく。
No.1ベストアンサー
- 回答日時:
> 例えば、このような関数をonClickで起動する場合、フォームに入力されていない
> 項目があると、警告されます。
> この時、submitはどの環境でも起動しないで終わるのでしょうか。
> それとも警告が起動した後、フォーム内容はsubmitされてしまうのでしょうか。
この関数の書き方だと、警告のメッセージボックスが表示され、OK を押すと、フォームの
内容は submit されます。
イベントハンドラでは、false を返すことで、本来の動作をキャンセルすることができます。
ですから、期待する(であろう)動作をするためには、
function tasikame {
//フォームの内容チェック
...
if ( フォームの内容が正しくなければ ) {
alert("入力されていない項目があります");
return false;
} else {
return true;
}
}
というような書き方になります。
解答ありがとうございます。
面倒なのでなるべく文を短くしようと思ったのですが、
やはりfalseは返した方がいいんですね。
参考になりました。
No.2
- 回答日時:
送信前の入力チェックを行うのであれば、submitボタンのonClickではなくて、FORMのonSubmitで行うべきですよ。
<FORM name="xxx" … onSubmit="return tasikame()">
このようにすることで、例えばIEで、テキストボックス内でEnterキーを押された時に、チェックを通らないで送信されることがなくなります。
ちなみに、送信される/されないは、a-kumaさんの回答の通りですので、入力チェック用の関数から true または false を返すようにしましょう。
また、呼び出し元の onSubmit="" の中でも、上記例のように、関数の戻り値をそのまま return するようにして下さい。
解答ありがとうございました。
onClickよりonSubmitの方でやるんですね。
ついつい、Enterキーの事を忘れてしまっていました。
こちらも参考にして、頑張ってみます。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
dijit.form.ComboBoxについて
-
フォームの値が0だったら空白...
-
javascriptで入力フォームが空...
-
テキストエリア入力文字数の表...
-
日付入力欄の表示形式を自動的...
-
手書き入力モードを利用して、...
-
onclickをEnterキーでも行いたい
-
return trueとreturn falseの用...
-
value内に変数を入れたい
-
javaScriptの変数をJavaの変数...
-
CSVファイルを読みこみ、プルダ...
-
プルダウンで選択すると、DBの...
-
ラジオボタンにタブインデック...
-
javascriptでASPにデータを渡す
-
javascript教えてください
-
confirm()で表示したダイアログ...
-
VBScriptでpingを実行(ブラウザ...
-
hiddenのvalueの値を変えたい
-
VB.NETで<Input>タグ、<text...
-
ラジオボタンでの動的項目の変...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
条件により、リンク先に画面遷...
-
onClickとsubmitの処理順序
-
JSPとJavaScriptの連携について...
-
javascriptで入力フォームが空...
-
日付入力欄の表示形式を自動的...
-
文末の改行コードを削除したい
-
テキストボックス入力を半角英...
-
Webブラウザにてページのりロー...
-
テキストボックスを無効にする...
-
JQueryで2つのテキストフィー...
-
入力モード 自動 切り替え
-
フォームの<TEXTAREA>で文字数...
-
HTMLで入力したものを変数で扱...
-
PDFフォームで条件つき金額を表...
-
イベント発生時に入力待ち状態...
-
数字の1文字目を消したい
-
submit後、同じ入力欄に戻らせ...
-
入力した文字を大文字に変換し...
-
フォームから入力すると、入力...
-
onChangeの使い方について教え...
おすすめ情報