web-dev-qa-db-ja.com

空白を無視するように必須フィールドを構成することはできますか？

HTML5の 必須 属性は非常に便利です。

<input type="text" required>

ただし、ユーザーは空白のみを入力できます。これに対するHTMLのみのソリューションはありますか？

htmlrequired-field
34
Benjamin

pattern属性と組み合わせてrequired属性を使用します。また、ほとんどのブラウザーは検証ポップアップのバブルにタイトルテキストを挿入するため、title属性も含めるようにしてください。

<input required pattern=".*\S+.*" title="This field is required">

.*\S+.*パターンには少なくとも1つの非空白文字が必要ですが、先頭または末尾に空白文字（スペース、タブ、キャリッジリターンなど）も許可されます。ユーザーが最初/最後に空白を入れられるようにしたくない場合は、代わりにこれを使用してください：

<input required pattern="\S+" title="This field is required">
70
James Messinger

pattern属性 を試してください。 「少なくとも1つの文字」を指定する正規表現 が必要です。

14
robertc

あなたはおそらくこれを望みます：

<input type="text" required pattern="\S(.*\S)?">

（入力の最初または最後に少なくとも1つの非空白文字があり、空白がない）

または、最初と最後の空白が問題ない場合は、次のようにします。

<input type="text" required pattern=".*\S.*">
0
Jeremy Moritz