HTML 属性: maxlength
maxlength 属性は、ユーザーが <input> または <textarea> に入力できる最大文字列長を（UTF-16 コード単位で）定義します。 0 以上の整数値である必要があります。
長さは UTF-16 コードユニットで測定され、（多くの文字体系では）文字数と等しくなります。 maxlength が指定されなかった場合、または無効な値が指定された場合は、 input には最大長が設定されません。
maxlength の値はすべて、 minlength が存在して有効である場合は、その値以上である必要があります。フィールドのテキスト値の長さが maxlength の UTF-16 コード単位の長さを超える場合、入力欄は制約検証に失敗します。制約検証は、ユーザーが値を変更した場合にのみ適用されます。
制約検証
ブラウザーは一般的に、 maxlength 属性が許可する以上のテキストをユーザーが入力することを防止しますが、長さが maxlength が許可しているよりも長くなった場合、 ValidityState オブジェクトの読み取り専用の tooLong プロパティが true になります。
試してみましょう
<label for="name">Product name:</label>
<input
id="name"
name="name"
type="text"
value="Shampoo"
minlength="3"
maxlength="20"
required />
<label for="description">Product description:</label>
<textarea
id="description"
name="description"
minlength="10"
maxlength="40"
required></textarea>
label {
display: block;
margin-top: 1em;
}
input:valid,
textarea:valid {
background-color: palegreen;
}
例
html
<input type="password" maxlength="4" />
仕様書
| Specification |
|---|
| HTML # attr-input-maxlength |
| HTML # attr-textarea-maxlength |