入力された値がスペースまたは空欄のときにalertを出す！ Javascriptの勉強

前回。.val()で値がnullのときまたは空欄のときにalertを出す！ jQueryの勉強という記事を書きましたが、スペースが入力された時もアラートを出したいなと思いサンプルコードを作成してみました。

Contents

入力された値がスペースまたは空欄のときにalertを出す方法

inputタグ内の値が、空欄やnull、スペースの時にalertを画面に表示します。はじめに空欄かnullかを判定し、違ければスペースかどうか判定しています。

let inputValue = $(‘input[name=”inputValue”]’).val();

if (inputValue == null || inputValue == “”) {
alert(“何か入力してね”);
} else if (inputValue.match(/^[ 　\r\n\t]*$/)) {
alert(“スペース以外で何か入力してね”);
}

match()のカッコ内にはスペースを現す正規表現が入っています。

上記だとわかりづらいのでHTMLを含めたものをcodepenで作成しました。

スペースが全角でも半角でも複数でもalertを出すことが可能です。

正規表現は難しいなと感じたので、他の方法を探してみました。

以下のようにtrimをし入力された値からスペースを消します。消したことにより空欄と同じ扱いになります。

value.trim() === “”

こちらも上記だけだとわかりづらいのでHTMLを含めたものをcodepenで作成しました。

同じくスペースが全角でも半角でも複数でもalertを出すことが可能です。こちらのほうがコードもシンプルでわかりやすいかもしれません。

正規表現は便利だけどなかなか自力では作れない。なるべく使おうとは思うけれど、今回はtrim()のほうが良さそうですかね。