- ベストアンサー
javascriptフォームエラーチェックの際のご質問
nekomikekamoの回答
validator.jsを下記の通り修正。 submitファンクション内のreturn false;の直前にf.focus();を追加。 //submitファンクション全体 submit: function(form) { this.allclose(form); var btns = new Array; for(var i = 0, f; f = form[i]; i++) { if(f.onblur) f.onblur(); if(f.type == 'submit') btns.push(f); } for(var i = 0, f, z; f = form[i]; i++) { if(f._validbaloon && f._validbaloon.visible()) { while(z = btns.shift()){ this.baloon.open(z, this.rule.submit()); } f.focus(); //修正箇所 return false; } } return true; },
関連するQ&A
- JavaScriptでフォームへのフォーカス処理
PHP、XHTML、CSSで応募フォームの作成をしております。 PHPとHTMLは別ファイルで作成しており、PHPにアクセスしてそのPHPが指定されたテンプレートを読みにいくような流れとなっております。 HTMLもPHPも完成して、応募フォームとして一通り動くようになったのですが、新たにフォーカス機能を追加したいということになりました。 具体的には、応募フォームの一番最初のテキストエリアに、ページ読み込み時にフォーカスを当てたいという内容です。 そこで、フォーカス機能用のJavaScriptを別ファイルで新たに作成し、動きを確認してみたところ上手く動きません。 HTMLとJavaScriptのソースは下記の通りです。 ==================================================================== ■HTML(全て書くと長くなってしまうので、簡略させていただきます) <script type="text/javascript" src="$path_top_js/focus.js"></script> <body onLoad="Focus()"> </head> <form name="top" action="index.php" method="POST" onReset="return false;" onSubmit="return false;"> <input type="hidden" name="USER_ID" value="$USER_ID"> <INPUT size="20" type="text" name="USER_ID" value="$USER_ID" MAXLENGTH="10"> </form> </body> ■JavaScript(focus.js) function Focus(){ document.top.USER_ID.focus(); } ==================================================================== 「フォームのname="USER_ID"というテキストエリアにフォーカスを当てる」という内容になります。 なぜフォーカスが当たらないのか、原因は予想がつくのですが、どう解決していいのか分かりません。 多分、フォームの値を保持するために記述しているhiddenタグ <input type="hidden" name="USER_ID" value="$USER_ID"> にJavaScriptのフォーカスが当たってしまっているみたいです。(フォーカスが当たっていると思われるhiddenタグは見ることができません) 試しにhiddenタグを外してみたところ、JavaScriptで指定したテキストエリアにフォーカスが当たっていることを確認しました。 「応募フォーム」ということで、ページ遷移した際にもフォームに入力した値を保持しておくためにhiddenタグは外したくないのですが、フォーカス機能もちゃんと動くようにしたいと思っております。 解決方法が分かる方いらっしゃいましたら、ご教授の程お願い致します。
- ベストアンサー
- HTML
- エラーチェックの送信について
下記のようなコードでエラーチェックを行い、エラーがなければ送信というシステムを書いています。 しかし、下記のような現象が起きます。 ・エラーチェックをし、エラーメッセージが出力されるが、表示されるダイアログを消すとエラーメッセージも消えてしまう。 これをエラーメッセージを残したままにしたいと考えています。 何卒よろしくお願い致します。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>JS入力チェックサンプル</title> <script type="text/javascript" src="jquery-1.8.0.js"></script> <script type="text/javascript" src="el_validation.js"></script> <style type="text/css"> .custom_error { background-color:#a00; }} </style> <script> // 初期化 $(document).ready(function(){ $.el_valid.init({ // 各種入力チェック "item01":{"rule":["required"]}, // 複合、チェックタイミングの指定 "item_a0":{"rule":["required","min_length[5]","max_length[10]"]}, // 複数のバリデーション "item_a1":{"rule":["required","url"], "on":"blur"}, // フォーカス移動時のみチェック "item_a2":{"rule":["required","email"], "on":"blur"}, // フォーカス移動時のみチェック "item_a3":{"rule":["required","tel"]}, // フォーカス移動時のみチェック // エラーの出力場所、表示方法変更 "item_b1":{"rule":["required"], "err":"item_b1_error"}, // エラー場所指定 "item_b2":{"rule":["required"], "err_class":"custom_error"}, // エラークラス指定 "item_b3":{"rule":["required"], "err":"item_b3_error", "err_class":"custom_error"} // エラー場所・クラス指定 }); }); // 全バリデーション var return_check = function() { if ($.el_valid.all()) { // 全チェック alert('チェックOK'); } else { alert('入力エラーがあります'); return(false); } } </script> </head> <body> <form method="post" onsubmit="return_cheack"> <table> <tr><td>必須</td><td><input type="text" id="item01"><span id="e_item01"></span></td></tr> <tr><td>必須、5から10文字</td><td><input type="text" id="item_a0"><span id="e_item_a0"></span></td></tr> <tr><td>電話番号（フォーカス移動時のみ）</td><td><input type="text" id="item_a3"><span id="e_item_a3"></span></td></tr> </table> <br> <input type="submit" value="送信" onclick="return_check()"><br><br> <a href="http://ellsif.com/blog/?p=1">blog記事</a> </form> </body> </html>
- ベストアンサー
- JavaScript
- javascriptが動かない原因
初めてのＨＰ制作に取り組んでいます。 htmlとcssはほぼ完成し、大体の構造は組みあがりました。 あとは「滑らかスクロール」「litebox」の２つのjavascriptを組み込むだけなのですが、両方ともうまくいきません。 原因としては何が考えられるでしょうか？ とりあえず、一方の「滑らかスクロール」について教えてください。 試したjs： http://blog.crara.cc/archives/173 とhttp://user1.matsumoto.ne.jp/~goma/js/ps2.html#sample （以前QNo.2848668で別のjsについての質問をしましたが、いただいた回答をもとに、貼るだけ簡単、なものを探しました） 現状： ダウンロードしたスクリプトをそのまま保存。 ヘッダーに<script type="text/javascript" src="tinyscrolling.js"></script>等を記述。 ファイル名や階層の間違いなし。 ・・・しかし、スクロールはせず一気に目的地まで飛びます。 また、ためしにこのファイルを開いてみようとすると、以下のようなエラーメッセージが出ます。 エラー： 'window'は宣言されていません。 コード： 800A1391 ソース： Microsoft JScript 実行時エラー （ちなみに、もう一方のスクリプトでも同じメッセージが出ました） 環境等： まだサーバーにはアップロードしていない状態。 ＩＥ６、WindowsXPです。 どうぞよろしくお願いいたします。
- ベストアンサー
- ブログ
- JavaScript内にJavaScriptを読み込む方法
HTML内に <script type="text/javascript" src="main.js"></script> という一行を追加すると、バナーが表示されるというスクリプトを作成しています。 main.jsは、 html = '<script language="JavaScript">'; html += 'var url0101 = "url01.xxx.jp";'; html += 'var url02 = "url02.oooo.jp";'; html += '</script>'; html += '<script language="JavaScript" src="http://xxx.xxxx.xxx/test.js"></script>'); html += '<script language="JavaScript">'; html += 'Function01("check")'; html += '</script>'; document.write(html); というような風になっており、 (1) 変数の宣言 ↓ (2) http://xxx.xxxx.xxx/test.jsの読み込み ↓ (3) (2)で読み込んだjs内の関数Function01を実行 という流れです。 FireFoxでは表示されましたが、IE6では (2)のjsを読み込む前に(3)のFunction01が実行され、 「オブジェクトを指定してください」のエラーが表示されてしまいます。 よい方法がありましたら教えていただけますでしょうか？ よろしくお願いします。
- 締切済み
- JavaScript
- JavaScript内にJavaScriptを読み込む方法
HTML内に <script type=\"text/javascript\" src=\"main.js\"></script> という一行を追加すると、バナーが表示されるというスクリプトを作成しています。 main.jsは、 html = \'<script language=\"JavaScript\">\'; html += \'var url0101 = \"url01.xxx.jp\";\'; html += \'var url02 = \"url02.oooo.jp\";\'; html += \'</script>\'; html += \'<script language=\"JavaScript\" src=\"http://xxx.xxxx.xxx/test.js\"></script>\'); html += \'<script language=\"JavaScript\">\'; html += \'Function01(\"check\")\'; html += \'</script>\'; document.write(html); というような風になっており、 (1) 変数の宣言 ↓ (2) http://xxx.xxxx.xxx/test.jsの読み込み ↓ (3) (2)で読み込んだjs内の関数Function01を実行 という流れです。 FireFoxでは表示されましたが、IE6では (2)のjsを読み込む前に(3)のFunction01が実行され、 「オブジェクトを指定してください」のエラーが表示されてしまいます。 よい方法がありましたら教えていただけますでしょうか？ よろしくお願いします。
- 締切済み
- JavaScript
- Dreamweaverメールフォーム作る際のCGIスクリプト書き換えについて
MX2004でメールフォーム入りのWebページを作っていますが、フォームを作り終えて、配布されているメールフォーム用CGIスクリプトを書き換えるところで行き詰ってしまっています！name="submit"の送信ボタンを押したら、各入力項目を単純にメール送信してくれて、「送信完了」ページを表示させるだけで十分なのですが、配布されているスクリプトプログラムのどこを削除したり書き換えればいいのかが理解できません。レンタルサーバーはロリポップを使用しています。どなた様かアドバイスをお願いします！！
- 締切済み
- CGI
- 外部JavaScriptがうまく呼び出せません
お世話になっております。 お分かりになります方いらっしゃいましたら、 ご教授願えますでしょうか？ 人材を募集する応募フォームを作っています。 応募フォームの項目にはいくつか必須項目があり、 送信ボタンを押した際、必須チェックをJavaScriptで 行いたいと思っています。 チェックする項目が多数あるので、直接htmlファイルには書き込まず、 外部jsに書き出して、htmlファイル上で呼び出す方法をとる事にしました。 htmlに直接書き込んだ際にはうまく動いたので、 JavaScriptの内容が悪いのではないと思うのですが、 送信ボタンを押しても、必須項目がチェックされず、 そのまま項目が空のメールが届いてしまいます。 以下に該当のコードを記入いたしますので、 原因がお分かりになります方、ご教授頂いてもよろしいでしょうか？ ・外部js：oncheck.js ・cgi：send.cgi 【oncheck.js】 <!-- function check(){ ・ (必須項目のチェックを行っています) ・ } //--> 【htmlファイル】 <html> <head> <title>採用情報</title> <script language=JavaScript src="oncheck.js" type=text/javascript> </script> </head> <body> <h3>応募フォーム</h3> <form method="POST" action="send.cgi" name="応募フォーム" onSubmit="return check()"> ・ ・ ・ <input type="submit" value=" 送信 "> <input type="reset" value=" 取消 "> </form> </body> </html> 呼び出し方に問題があるのでしょうか？ 宜しくお願い致します。
- ベストアンサー
- JavaScript
- JavaScriptで以下のようなメールフォームを作成しているのですが
JavaScriptで以下のようなメールフォームを作成しているのですが、確認画面がうまく表示されず困っています。項目が4～5個のテキストとセレクトボックスのフォームは動いたのですが、ラジオボタンやチェックボックス、画像アップロードを追加して項目を増やしたら、Scriptがよくわからなくなってしまいました。 ここに内容を書くと長くなるので以下のリンクのソースを参照いただけると助かります。 どうぞご教授のほどよろしくお願いします。 ■メールフォーム http://stage.chiikeys.jp/t_test/form/test.html ■確認ページ http://stage.chiikeys.jp/t_test/form/preview01.html
- ベストアンサー
- JavaScript
- javascriptのエラー
スクリプトエラーが発生します。 ウィンドウのサイズを変更させようとウィンドウ右端をドラッグしようとすると発生するエラーで 「ランタイム エラーが発生しました。行8：エラー：オブジェクトを指定してください」と出ます。 1：<HTML> 2：<HEAD> 3：<TITLE>情報</TITLE> 4：<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=x-sjis"> 5：<LINK rel="stylesheet" href="../common/ｘｘｘ_win.css" type="text/css"> 6：<SCRIPT SRC="/common/ｘｘｘ.js" LANGUAGE="JavaScript"></SCRIPT> 7：</HEAD> 8： 9：<BODY BACKGROUND="../common/bg01.gif" BGCOLOR="#FFFFFF" LINK="#1100CC" ALINK="#FF0000" VLINK="#5500CC" TEXT="#000000" TOPMARGIN="0" LEFTMARGIN="0" RIGHTMARGIN="0" MARGINWIDTH="0" MARGINHEIGHT="0" onResize="MyReload();"> というのがソースです。 どなたかエラーの原因がわかりましたら、教えていただけませんか？ よろしくお願いいたします。
- ベストアンサー
- JavaScript
- IE8に更新したら、エラー表示が頻繁にでる。
インターネットブラウザをIE７からIE８に更新したところ、開く度に、スクリプトエラーのメッセージが表示され、しかも、 ノートンセキュリティが、リスク表示（赤）になります。解決方法を教えて下さい。 エラー表示内容 ライン：74 文字：167 エラー：実装されていません コード：０ URL：http://apie.jword.jp/js/all.min.js ちなみに、OSはXPです。
- 締切済み
- ネットワーク
お礼
ありがとうございます！ 無事に実装出来ました＾＾