質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

6回答

6557閲覧

【jQuery】テキストボックスが全角空文字のとき未入力としたい

k499778

総合スコア599

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

1クリップ

投稿2016/04/20 11:42

現在テキストボックスの未入力チェックを行っています。

テキストボックスが空白の場合は、
if($('#txtbox').val()===''){

//アラート処理

}

で対応できるのですが、
全角スペースはこれに引っかかりません。

この対処方法を知っている方や参考サイトを知っている方がいらっしゃいましたら教えていただけると有難いです。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答6

0

全角スペースを削除して比較してはどうですか?

javascript

1if($('#txtbox').val().replace(/\s+/g, "")===''){ 2 3 //アラート処理 4 5}

投稿2016/04/20 11:47

CodeLab

総合スコア1939

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

k499778

2016/04/20 11:51

回答ありがとうございます。 おそらく求めていたロジックです。 正規表現はあまり詳しくないのですが、これは複数の全角スペースがある場合も条件分岐に引っかかるでしょうか? もしお時間ございましたらお答えいただけたら嬉しいです。
k499778

2016/04/20 14:47

回答有り難うございます。 皆さんのおかげで解決することができました。 感謝します。
guest

0

javascript

1var input = $('#txtbox').val(); 2if (/^[\s ]*$/.test(input)) { 3 //アラート処理 4}

投稿2016/04/20 12:57

root_jp

総合スコア4666

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

k499778

2016/04/20 14:47

回答有り難うございます。 皆さんのおかげで解決することができました。 感謝します。
guest

0

ベストアンサー

質問文では「全角スペース」とありますが、半角空白/タブ文字等の空白文字全般の連続を認識したいものとして解釈します。

jQuery.trim

jquery-2.2.3.js を確認したところでは、jQuery.trim は下記コードと等価です。

JavaScript

1function trim ( text ) { 2 return text == null ? '' : (text + '').replace(/^[\x20\t\r\n\f]+|((?:^|[^\\])(?:\\.)*)[\x20\t\r\n\f]+$/g, ''); 3}

見ての通り、全角空白を含まない為、今回は使えません。

String.prototype.trim

String.prototype.trim は Unicode 規定の Zs を含む為、全角空白も削除します。
\s も ES3 当時から Zs を含みますが、IE8- は独自仕様で対応しない為、\s+ で削除する事ができません。
過去に Polyfill を書いたので github を参照して下さい。

JavaScript

1if (jQuery('#txtbox').val().trim() === '') { // for IE9+ 2 // 処理 3}

Re: k499778 さん

投稿2016/04/20 12:53

think49

総合スコア18156

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

k499778

2016/04/20 14:44

回答有り難うございます。 解決することができました。 ちなみになのですが、for IE9+とはどういう意味でしょうか? 動作確認をしたのが、IE9+ということでしょうか? それとも対応しているOSのバージョン関連のことでしょうか?
k499778

2016/04/21 00:11

返答ありがとうございます。 IE8-とかだと動かないんですね。 まだアプリの対応バージョンがわからないのでなんとも言えませんが、String.prototype.trimの対応バージョンはわかりました。 教えていただきありがとうございます。
guest

0

JavaScript

1// わかりやすく書くと 2str = $('#txtbox').val(); 3str = str.replace(/ /g, " "); //全角スペースを半角スペースに変換 4str = str.replace(/ /g, ""); //半角スペースを削除 5// 他にも条件があるなら関数にまとめた方がいいかも 6if(str===''){ 7 8 //アラート処理 9 10}

投稿2016/04/20 12:07

takasima20

総合スコア7458

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

k499778

2016/04/20 14:47

回答有り難うございます。 皆さんのおかげで解決することができました。 感謝します。
guest

0

正規表現で空白だけかチェックすればどうかな(下のコードではコメントアウトしてある部分)、と思いましたが、$.trim() で空白文字をトリムして空になるかをチェックする方がスマートかも、です。
$.trim() も内部で正規表現で空白を除去しているようです。

で、いずれも全角空白は正規表現の \s にマッチすればいいわけですが、\s にマッチするかどうかはブラウザ依存のようです。詳しくは調べないとわかりませんが、IE8 以前だと全角空白が \s にマッチしないのだとか。最近のブラウザならマッチすると考えてもいいと思います。
もし、IE8 もサポート対象にするなら、$.trim() を使わず、正規表現として /^\s*$/ ではなく、/^[\s ]*$/ を使って(s] の間に全角空白)マッチするかで判定するといいと思います。

html

1<!DOCTYPE html> 2<html> 3<head> 4<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 5</head> 6<body> 7 <input type="button" value="チェック" id="checkButton" /> 8 <input type="text" value="" id="txtbox" /> 9 <span id="alert" style="color:red;">空だよ</span> 10</body> 11<script> 12$(function() { 13 $('#alert').hide(); 14 $('#checkButton').on('click', function() { 15 /* 16 if ($('#txtbox').val().match(/^\s*$/)) { 17 $('#alert').show(); 18 } else { 19 $('#alert').hide(); 20 } 21 */ 22 if ($.trim($('#txtbox').val()) === '') { 23 $('#alert').show(); 24 } else { 25 $('#alert').hide(); 26 } 27 return false; 28 }); 29}); 30</script> 31</html>

投稿2016/04/20 12:01

unau

総合スコア2468

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

k499778

2016/04/20 14:47

回答有り難うございます。 皆さんのおかげで解決することができました。 感謝します。
guest

0

or条件を追加してやればよいのでは?

投稿2016/04/20 11:46

退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

k499778

2016/04/20 11:48

回答ありがとうございます。 全角スペースが1つだけの場合はそれでもいいのですが、 複数の全角スペースがある場合、そのバリデーションを抜けてしまいます。 そういった点も対応できるようにしたいのです。 もしおわかりであれば教えていただけると嬉しいです。
k499778

2016/04/20 14:47

回答有り難うございます。 皆さんのおかげで解決することができました。 感謝します。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問