JavaScriptでの空白チェックの方法

前へ 次へ
このQ&Aのポイント
  • JavaScriptを使用して、ユーザー登録ページの項目に空白が入っているかどうかを確認する方法について教えてください。
  • 性別と月日は未入力にならないようになっていますが、他の項目に関してはテキストボックスなので、空白チェックを行いたいです。
  • 半角空白や全角空白のみが入力された場合にもチェックするためのコードを教えてください。
回答を見る
  • ベストアンサー

JavaScriptでの空白チェックの方法

ユーザー登録ページで、項目に空白が入っているかを調べたいと 思っています。 （入力する項目） 　・ユーザID　・パスワード　・名前（カナ） 　・性別（←ラジオボタンで選択する） 　・生年月日（←西暦のみ入力し、月日は選択メニューより選ぶ） このうち、性別と月日は未入力になることはないのですが、 他の項目に関しては、テキストボックスなので、以下のチェックを つけました。 <SCRIPT language="JavaScript"> <!-- function formCheck() { if (document.tourokuForm.userId.value == "" || 　　　document.tourokuForm.passWord.value == "" || 　　　document.tourokuForm.name.value == "" || 　　　document.tourokuForm.year.value == "" ) 　{ 　　　alert("すべての項目を入力してください。"); 　　　return false; 　} } //--> </SCRIPT> という風なチェックを行っています。 項目の未入力チェックはうまくいくのですが、値ではなく、 「半角空白」、又は「全角空白」のみ入れたときにチェックされず、 空白のまま次のページへとんでしまいます。 コードを使って判断させようと思いましたが、リファレンスの通り に書いてもうまくいきませんでした。 もし知っておられる方がいましたら、ぜひ教えてください！

質問者が選んだベストアンサー

  • ベストアンサー
  • xruz
  • ベストアンサー率50% (72/143)
回答No.1

おはようございますvaniraberryさん、xruzです。 こんな感じでよかったでしょうか？ （Ie5.5sp2、NN4.75、NN6.1動作確認済み：但しOSはWindows系のみ） <html> <head> <meta http-equiv="content-type" content="text/html; charset=euc-jp"> <title>spacechk</title> </head> <script language="javascript"> <!-- function spCheck(trg) { var ck=escape(trg); if((ck=="%20") || (ck=="%u3000")) return true; return false } function formCheck() { if(spCheck(document.frm.txt.value)) alert("isSpace"); } //--> </script> <body> <form method="post" name="frm"> <input type="text" name="txt" value=""> <input type="button" value="check" onclick="formCheck();";> </form> </body> </html> がんばってくださいね。

vaniraberry
質問者

お礼

ソース付きの、分かりやすい回答をありがとうございました。 コードの使い方がやっと分かりました！ "%20"の部分を0x20と書いていたので動かなかったみたいです。 とても助かりました!

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • 空白チェック

    下記はテキストボックスのいずれかに空白があればalertで知らせるものですが、特定のテキストボックスになんらかの印をつけておいて、それのみチェックできないでしょうか。nama="" の名称以外の取得の方法で。 function EmptyCheck(){ i=0; while(i<20){ if(!document.main.elements[i].value){ alert("入力されていない項目があります。"); return false; } i++; } }

  • JavaScript でメールアドレスのチェックをするには・・・？

    入力フォームで正しいメールアドレスが入力されたのかを確認するため、以下のようなJavaScriptを記述しましたが、動作しません。 関数FormCheckは動作するのですが、関数Checkは動作しません。 現状では、メールアドレスを入力する欄に「www」とだけ入力しても チェックされないので、その他の入力項目がきちんと入力できていれば メール送信されてしまいます。 どのようにすればこのCheck関数が動作するのかどなたか教えていただけないでしょうか？よろしくお願いします。 --------------------Java Script 部分--------------------------- <script language="JavaScript"> <!-- //必須項目のチェック function FormCheck(Form) { Error = new Array(); i = 0; // 氏名の入力チェック if ((Form["name"]) && (Form["name"].value == "")) { Error[i] = "氏名は必須項目です。"; i++; } // メールアドレスの入力チェック if ((Form["email"]) && (Form["email"].value == "")) { Error[i] = "メールアドレスは必須項目です。"; i++; } // 質問したい支店の選択チェック if ((Form["address"]) && (Form["address"][0].selected == true)) { Error[i] = "質問したい支店は必須項目です。"; i++; } // 未入力があればアラート if (Error.length > 0) { ErrorText = Error.join("\n"); alert ("未入力項目があるので送信できません。\n\n"+ErrorText); return false; } } // --> <!-- //メールアドレスチェック var mail; function Check(){ mail = document.myform.email1.value; if(!mail.match(/.*@.*\..*/i)){ alert("メールアドレスが不正です。"); } } // --> </script> --------------------HTML 部分----------------------------------- <body> <table width="419" height="453"> <tr> <td width="732"> <form action="./cgi/test/sendmail.cgi" name="myform" method="POST" target="_self" onSubmit="return FormCheck(this);Check()"> <table width="481"> <!--氏名を入力 --> <tr> <td><strong>氏名</strong></td> <td><input type="text" name="name" size="30" maxlength="50"></td> </tr> <!--メールアドレスを入力 --> <tr> <td><strong>メールアドレス</strong></td> <td><input type="text" name="email" size="50" maxlength="60"></td> </tr> <!--支店選択 --> <tr> <td><strong>質問したい支店</strong></td> <td> <select name="address"> <option value="" selected></option> <option value="aaa@hoemail.com">A支店</option> <option value="bbb@hoemail.com">B支店</option> <option value="ccc@hoemail.com">C支店</option> </select> </td> </tr> </table> <!--送信・キャンセルボタン --> <center> <table> <tr> <td><input type="submit" name="submit" value="送 信"></td> <td><input type="reset" name="reset" value="キャンセル"></td> </tr> </table> </center> </form> </td> </tr> </table>

  • 未選択のチェック方法を教えて下さい。

    内容確認のページに行く前に各項目の未入力・未選択チェックをしたいのです。 テキストフィールド（名前）の未入力チェックはなんとかできましたが、ラジオボタン・ セレクトメニュー・チェックボックスの未選択チェックプログラムが解からなくて 困ってます。教えてｇｏｏに載っている回答などを参考にコピペしたりして 試してみたのですが・・・できませんでした。どなたか教えて下さい。 <SCRIPT language="javascript"><!-- function kakunin(f) { 　　var prm = new Array(); 　　　if (document.fomu.名前.value ==""){ 　　　alert ("名前を記入して下さい。"); 　　　　　fomu.名前.focus(); 　　　return false; 　　} 　　if (f.名前.value) prm[prm.length] = "名前="+escape(f.名前.value); //*****ここでラジオボタンの未選択チェックをしたい。***** 　for (var i=0; i<f.性別.length; i++) 　　if (f.性別[i].checked) prm[prm.length] = "性別="+escape(f.性別[i].value); //*****ここでセレクトメニューの未選択チェックをしたい。***** 　if (f.使用ＯＳ.value) prm[prm.length] = "使用ＯＳ="+f.使用ＯＳ.options[f.使用ＯＳ.selectedIndex].value; //*****ここでチェックボックスの未選択チェックをしたい。***** 　for (var i=0; i<f.おまけ.length; i++) 　　if (f.おまけ[i].checked) prm[prm.length] = "おまけ="+escape(f.おまけ[i].value); location.href = "＠＠＠＠＠.html?"+prm.join('&'); return false; } //--></SCRIPT>

  • 現在javascriptでチェックボックスで選択した項目のvalueを

    現在javascriptでチェックボックスで選択した項目のvalueを次ページに渡すものを作成しています。 １つだけ選択すると正常に値が動くのですが、複数選択すると後に選択したほうの値だけが入ってしまいます。 複数選択した場合に選択した全てのvalueが入るようにするにはどうしたらいいでしょうか？ 【1ページ目ソース】 <html> <head> <title>1page</title> </head> <body> <form name="F1" onsubmit="window.open('2page.html','_blank','');return false;"> A<input type="text" id="tanka1"> B<input type="checkbox" name="che1" id="check1" value="1">1 <input type="checkbox" name="che1" id="check1" value="2">2 <input type="checkbox" name="che1" id="check1" value="3">3 <input type="submit" value="送信" onclick=check();></form> </body> </html> 【2ページ目ソース】 <html> <head> <title>2page</title> <script> window.onload=function (){ document.F2.tanka1.value=window.opener.document.F1.tanka1.value; if (window.opener.document.F1.che1[0].checked)document.F2.check1.value=1; if (window.opener.document.F1.che1[1].checked)document.F2.check1.value=2; if (window.opener.document.F1.che1[2].checked)document.F2.check1.value=3; } </script> </head> <body> <form name="F2"> A<input type="text" id="tanka1"> B<input type="text" id="check1"> <br><br> </body> </html>

  • 小説HTMLの小人さん 必須項目チェックJavascript自動生成ツール

    本日、steel_grayより良回答頂き、解決しましたが、また難題にぶちあたり、どうしてもクリアにできません。 ショッピングカートで同一ページ内に２つ以上の<form>～<form>を置いたカートボタンを押したときに、入力チェックを行うjavascriptで、それぞれ、個別のエラーメッセージを出したくなりました。また、小説HTMLの小人さん 必須項目チェックJavascript自動生成ツールを発見して、簡単にjavaソースができるのでいいかと思いましたが、同一ページ内で２つ以上のフォームでは、エラーチェックができず、困っています。 問題の部分 ---------------------------------------------------------------- <script type="text/javascript"> <!-- function FormCheck(Form) { Error = new Array(); i = 0; // くだものを選択して下さいの選択チェック if (Form["くだもの"][0].selected == true) { Error[i] = "くだものを選択して下さいは必須項目です。"; i++; } // やさいを選択して下さいの選択チェック if (Form["やさい"][0].selected == true) { Error[i] = "やさいを選択して下さいは必須項目です。"; i++; } // 未入力があればアラート if (Error.length > 0) { ErrorText = Error.join("\n"); alert ("項目エラー\n\n"+ErrorText); return false; } } // --> </script> --------------------------------------------------------------- <form name="" method="post" action="***.cgi" onsubmit="return FormCheck(this)"> <select name="くだもの"> <option selected>選択</option> <option value="りんご">りんご</option> <option value="みかん">みかん</option> <option value="ばなな">ばなな</option> </select><br> <br> <input type="submit" value="カートに入れる"> </form> <form name="" method="post" action="***.cgi" onsubmit="return FormCheck(this)"> <select name="やさい"> <option selected>選択</option> <option value="にんじん">にんじん</option> <option value="きゃべつ">きゃべつ</option> <option value="だいこん">だいこん</option> </select><br> <br> <input type="submit" value="カートに入れる"> </form>

  • ネスケで動かない空白チェック

    下記のようにリストボックスの未選択をチェックしていますが、ネスケだと動きません。アドバイスをいただけないでしょうか。 function submitCheck(){ for( i=0 ; i<document.main.length ; i++ ){ if(document.main.elements[i].type == "select-one" && document.main.elements[i].value == "err"){ alert("未選択項目があります。"); document.main.elements[i].focus(); return false; } } } <FORM NAME="main" ACTION="test.cgi" METHOD="post" onSubmit="return submitCheck()"> <SELECT NAME="性別"> <OPTION value="err" SELECTED>↓【選択して下さい】</OPTION> <OPTION>男</OPTION> <OPTION>女</OPTION> </SELECT> <INPUT TYPE="submit" VALUE="送　信" onClick="document.main.name.value=''">

  • Javascriptでセレクトメニューの選択チェックの方法

    Javascriptでセレクトメニューのフォームをチェックしたいのですが、 リストメニューの「選択して下さい」を選んだままだと、「番号を選択して下さい。」とエラーを出したいのですが、下記の様に書いてみたのですが、うまく動きません…どのように書けばいいか教えて下さい。宜しくお願いします。 <script language=＼"JavaScript＼"> <!-- function Check() { var str = document.form.a.value; if(document.form.a.value == "0") { alert("番号を選択して下さい"); } //--> </script> <form id="form" name="form" method="post" action="##"> <select name="a" onblur="Check();"> <option value="0">選択して下さい</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> <input type="submit" name="Submit" value="登録" onClick="Check();"> </form>

  • Javascriptによる入力チェックについての質問です。

    Javascriptによる入力チェックについての質問です。 入力フォームから確認画面に遷移する前に入力チェックを以下のように行っていますが、 メールアドレスを一回目と二回目の内容をチェックするにはどうしたらいいでしょうか？ <script type="text/javascript"> <!-- function check_form(f){ var error_message = ""; // 必須チェック if (f.username.value == "") { error_message += "「お名前」を入力してください。\n"; } if (f.namekana.value == "") { error_message += "「お名前（フリガナ）」を入力してください。\n"; } if (f.email.value == "") { error_message += "「メールアドレス」を入力してください。\n"; } if (f.email2.value == "") { error_message += "「メールアドレス（再度確認）」を入力してください。\n"; } if (f.telno.value == "") { error_message += "「電話番号」を入力してください。\n"; } // 全角チェック if (f.username.value.match( /[^ぁ-んァ-ン　\s]+/ ) ) { error_message += "「お名前」正しく入力してください。\n"; } if (f.namekana.value.match( /[^ぁ-んァ-ン　\s]+/ ) ) { error_message += "「お名前（フリガナ）」正しく入力してください。\n"; } // 電話番号チェック if (f.telno.value.match(/[^0-9|-]+/)) { error_message += "「電話番号」を正しく入力してください。\n"; } // メールアドレスチェック if (!f.email.value.match(/.+\@.+\.+/)) { error_message += "「メールアドレス」を正しく入力してください。\n"; } if (!f.email2.value.match(/.+\@.+\.+/)) { error_message += "「メールアドレス（再度確認）」を正しく入力してください。\n"; } // エラー判定 if (error_message != "") { error_message = "入力内容に誤りがあります。以下の内容を確認してください。\n\n" + error_message; alert(error_message); return false; } return true; } // --> </script> //メールアドレス確認用チェック if ( !f.email.value.match(email == email2) ){ error_message += "正しいメールアドレスを入力してください。\n"; } このようにしてみたんですが、ダメでした。 あと、今はhtml内に直接javascriptを書いてますが、上記だけじゃなくチェック項目が多いので外部ファイルにする方法も教えてください。 <script type="text/javascript" src="formcheck.js"></script> <input type="button" value="参加申込方法ページへ戻る" onClick="return goReturn(0,'http://xxxx')"> &nbsp;&nbsp; <input type="submit" value="入力内容を確認する" onClick="check_form();"> としてみても上手く行きません。どこを直すべきか教えてください。

  • チェックボックスのチェックした項目の名前を取得したいです。

    チェックボックスのチェックした項目の名前を取得したいです。 HTML+Javascript+CGIでアンケートフォームを作っています。 送信ボタンを押したときに確認画面を表示させたいのですが、チェックボックスの項目をどう扱って良いのかわかりません。 性別を選択するラジオボタンの値の取得（男をチェックしたか、女をチェックしたか）は sex = document.mailform.sex[0].checked ? document.mailform.sex[0].value : document.mailform.sex[1].value このように出来るとのことですが、チェックボックスはどうしたら良いのでしょうか？ 好きな食べ物を聞くチェックボックスで、選択項目に ・リンゴ・バナナ・ミカン・イチゴ を用意し、チェックされた項目を 好きな食べ物：リンゴ イチゴ の用に出力したいと思っています。 よろしくお願いします。

  • 入力チェックをしたいです。

    結構初心者です。 フォームに入力された内容をチェックしたいので、まず下記のように書きました。 <script Language="JavaScript"> <!-- function submitCheck(){ var flag = 0; // 設定開始（必須にする項目を設定します） if(document.insert.MatterID.value == ""){ flag = 1; } else if(document.insert.name.value == ""){ flag = 1; } else if(document.insert.Correspondencedate.value == ""){ flag = 1; } if(flag){ window.alert('必須項目に未入力があります。'); // チェックされていない場合は警告ダイアログを表示 return false; // 送信を中止 } else{ return true; // 送信を実行 } } --> </script> で、これにチェックボックスの入力チェックも含めたいのですが、ただ else if(document.insert.bld_ReceiptNo.checked){ flag = 1; } こうするだけではダメなのですね；； どうすればいいかお知恵を拝借できませんでしょうか。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する