人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

検索ボタンを押下時に、入力値をチェックして不正だったら、フォーム送信を中断したいです。
ただ、条件として、submitボタンは画像である必要があります。
そこで、以下でやろうとしましたが、以下ですと、
//php
echo $form->submit('img.jpg', array('type' => 'submit','onClick' => 'aaa();','div' => false,'alt' => '検索'));
//出力されるソース
<input type="image" src="/img/img.jpg" onclick="aaa();" alt="検索">

上記の場合、問題なのが、入力後すぐに検索ボタンをクリックすると、
blurイベント→submitの順で処理がされるので、return false を設定しても処理を中断しません。

なにかよい別案ないでしょうか。

●質問者: FujiiRock
●カテゴリ:コンピュータ ウェブ制作
○ 状態 :終了
└ 回答数 : 5/5件

▽最新の回答へ

1 ● nobuoka
●0ポイント

実際に submit の処理はどこで行われるのか (input 要素の onclick イベントハンドラとして設定されている aaa という関数は何をするのでしょうか?) や、『blurイベント→submitの順で処理がされるので、return false を設定しても処理を中断しません』 という部分などがよくわからないのですが、とりあえず参考になりそうなことを書いておきます。

form の submit に関する文書 を読むと、submit の処理の中で submit イベントが発生し、それがキャンセルされると submit の処理はそこで abort されると書かれています。

If the submitted from submit() method flag is not set, then fire a simple event that bubbles and is cancelable named submit, at form. If the event's default action is prevented (i.e. if the event is canceled) then abort these steps.

4.10.18.3 Association of controls and forms ? HTML Standard

なので、form 要素の submit イベントに対してイベントリスナを設定して、イベントリスナの中で入力値をチェックし、不正であったならばイベントをキャンセルすればよいのではないでしょうか? サンプルコードを書きましたので参考にしてください。


2 ● yoshioms
●0ポイント

aaaでバリデーション処理があって、return falseしてるってことでしょうか?
onclick="return aaa()"
でもダメですか?


FujiiRockさんのコメント
ありがとうございましたっ

3 ● oil999
●100ポイント ベストアンサー

php側でFORMにsubmitしているので順序が入れ替わってしまいます。
入力値のチェックはJavaScriptで行い、JavaScript内で下記のようにsubmitを発行してください。
http://www.confrage.com/javascript/form/form_submit/form_submit.html


FujiiRockさんのコメント
いつもありがとうございますっ

4 ● taroe
●0ポイント

onclick="aaa();"を
onclick="aaa();return false;"

に変更してみては?


5 ● otusoham
●0ポイント

http://jsfiddle.net/nobuoka/e6TAq/

こちらはどうでしょうか。

関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ