Thuộc tính mẫu HTML
Định nghĩa và Cách sử dụng
Thuộc patterntính chỉ định một biểu thức chính quy mà
<input>giá trị của phần tử được kiểm tra.
Lưu ý: Thuộc patterntính hoạt động với các loại đầu vào sau: văn bản, ngày tháng, tìm kiếm, url, số điện thoại, email và mật khẩu.
Mẹo: Sử dụng thuộc tính global titleđể mô tả mẫu giúp người dùng.
Mẹo: Tìm hiểu thêm về biểu thức chính quy trong hướng dẫn JavaScript của chúng tôi.
Áp dụng đối với
Thuộc patterntính có thể được sử dụng trên phần tử sau:
| Thành phần | Thuộc tính |
|---|---|
| <input> | mẫu |
Các ví dụ
Ví dụ đầu vào
Biểu mẫu HTML có trường nhập chỉ có thể chứa ba chữ cái (không có số hoặc ký tự đặc biệt):
<form action="/action_page.php">
Country code: <input type="text" name="country_code"
pattern="[A-Za-z]{3}" title="Three letter country code">
<input type="submit">
</form>
Ví dụ về mật khẩu
Phần tử <input> có type = "password" phải chứa 6 ký tự trở lên:
<form action="/action_page.php">
Password: <input type="password" name="pw" pattern=".{6,}" title="Six or more characters">
<input type="submit">
</form>
Ví dụ về mật khẩu
Phần tử <input> có type = "password" phải chứa 8 ký tự trở lên có ít nhất một số và một chữ hoa và chữ thường:
<form action="/action_page.php">
Password: <input type="password" name="pw" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="Must contain at least one number and one uppercase and lowercase letter, and at least 8 or more characters">
<input type="submit">
</form>
Hỗ trợ trình duyệt
Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ thuộc tính.
| Attribute | |||||
|---|---|---|---|---|---|
| pattern | 5.0 | 10.0 | 4.0 | Not supported | 9.6 |