Thuộc tính disabled xác định rằng trường dữ liệu đầu vào bị vô hiệu hóa, tức là không thể sử dụng, không thể click vào và giá trị cũng không được gửi khi biểu mẫu gửi đi.

 Tên:

 

Thuộc tính size

Thuộc tính size xác định kích thước (tính bằng kí tự) cho trường nhập dữ liệu.

 Tên:

 

Thuộc tính maxlength

Thuộc tính maxlength xác định độ dài tối đa cho trường nhập dữ liệu.

 Tên:

 

Với thuộc tính maxlength, trường dữ liệu đầu vào không chấp nhận nhiều hơn số kí tự đã định sẵn cũng không phản hồi lại cho người dùng khi mắc lỗi. Nếu muốn cảnh báo người dùng, bạn phải dùng JavaScript.

Các thuộc tính trong HTML5

HTML5 có bổ sung thêm các thuộc tính dưới đây cho phần tử

• autocomplete
• autofocus
• form
• formaction
• formenctype
• formmethod
• formnovalidate
• formtarget
• height and width
• list
• min and max
• multiple
• pattern (regexp)
• placeholder
• required
• step

và các thuộc tính sau cho phần tử

 Tên:

 Họ: 

 E-mail: 

 

Thuộc tính novalidate là một thuộc tính của

 E-mail: 
 

Thuộc tính autofocus xác định trường nhập dữ liệu tự động được làm nổi bật khi tải trang. Trong ví dụ dưới đây là trường nhập tên.

Tên:

Thuộc tính form xác định một hoặc nhiều biểu mẫu mà phần tử đó thuộc về. Để tham chiếu tới các biểu mẫu khác, cần sử dụng danh sách các id của biểu mẫu, cách nhau bằng dấu phẩy. Dưới đây là ví dụ trường nhập dữ liệu nằm ngoài biểu mẫu HTML (nhưng vẫn là một phần trong biểu mẫu đó).

 Tên: 

 


Họ: 

Thuộc tính formaction xác định URL của tập tin sẽ xử lý dữ liệu đầu vào khi biểu mẫu được gửi đi. Thuộc tính này sẽ ghi đè lên thuộc tính action của phần tử

 Tên: 

 Họ: 

 

 

Thuộc tính formenctype cho biết dữ liệu trong biểu mẫu sẽ được mã hóa thế nào khi gửi đi (chỉ áp dụng với các biểu mẫu có method=”post”). Thuộc tính này ghi đè thuộc tính enctype trong phần tử

 Tên:

 

Thuộc tính formmethod xác định phương thức HTTP để gửi dữ liệu tới URL, nó sẽ ghi đè thuộc tính method trong phần tử

 Tên:

 

Thuộc tính formnovalide ghi đè thuộc tính novalidate của phần tử

 Tên:

 

Thuộc tính formtarget cho biết tên hoặc từ khóa chỉ ra nơi hiển thị phản hồi khi người dùng gửi biểu mẫu đi, nó sẽ ghi đè lên thuộc tính target của phần tử

 Tên:

 

Thuộc tính height và width xác định chiều cao và độ rộng của phần tử . Hãy nhớ luôn xác định kích thước của ảnh.

 Tên:

 

Thuộc tính list tham chiếu tới phần tử

 Tên:

 

Thuộc tính min và max xác định giá trị tối thiểu và tối đa cho phần tử dùng với các kiểu dữ liệu đầu vào: số, khoảng, ngày, ngày giờ, thời gian, tháng, tuần.

 Tên:

 

Thuộc tính multiple cho biết người dùng có được nhập nhiều hơn một giá trị cho phần tử không, dùng với các kiểu dữ liệu email và tập tin.

 Tên:

 

Thuộc tính pattern cho biết biểu thức chính quy mà giá trị của phần tử sẽ phải kiểm tra với, nó dùng với các kiểu dữ liệu: văn bản, tìm kiếm, URL, số điện thoại, email và mật khẩu. Hãy dùng các thuộc tính title toàn cục để mô tả:

Dưới đây là ví dụ cho thấy trường nhập dữ liệu chỉ chấp nhận 3 chữ cái (không chấp nhận số hay kí tự đặc biệt).

 Tên:

 

Thuộc tính placeholder gợi ý một giá trị nào đó cho trường nhập dữ liệu (thường là giá trị mẫu hay mô tả ngắn gọn về định dạng cần nhập), hiển thị trước khi người dùng nhập dữ liệu. Nó dùng với các kiểu dữ liệu: văn bản, tìm kiếm, URL, số điện thoại, email và mật khẩu.

 Tên:

 

Thuộc tính required cho biết phải nhập trường dữ liệu đó mới có thể gửi biểu mẫu, dùng với các kiểu dữ liệu: văn bản, tìm kiếm, URL, số điện thoại, email, mật khẩu, chọn ngày, số, checkbox, nút tròn, tập tin.

 Tên:

 

Thuộc tính step cho biết khoảng cách giữa các giá trị số hợp lệ trong phần tử . Ví dụ nếu step=”3” thì các con số hợp lệ sẽ là -3, 0, 3, 6… Có thể dùng kết hợp thuộc tính này với thuộc tính min và max để tạo khoảng giá trị hợp lệ.

Thuộc tính này dùng với các kiểu dữ liệu: số, khoảng, ngày, ngày giờ, tháng, thời gian, tuần.

 Tên:

 

Bài trước: Các loại dữ liệu đầu vào của phần tử input trong HTML

Bài sau: Giới thiệu về HTML5

• Định dạng chuẩn và quy ước viết code trong HTML5

Thứ Tư, 15/04/2020 08:55

4,5 ★ 11 👨 76.628

0 Bình luận

Sắp xếp theo

Xóa Đăng nhập để Gửi

Bạn nên đọc

• 
  Thực hư chuyện iPhone có thể dùng để nghe lén? Làm gián điệp dễ vậy sao?
• 
  Trung Quốc: Tin tặc đánh cắp tài khoản game tăng mạnh
• 
  Điện thoại Android của bạn đang dùng chip Snapdragon, Exynos, MediaTek hay Tensor?
• 
  Cách nhận free skin Butterfly Phượng Cửu Thiên Liên Quân Mobile
• 
  Mozilla ban hành bản sửa lỗi trình duyệt Firefox
• 
  OPPO tự sản xuất bộ xử lý AI riêng, sẵn sàng trang bị trên flagship ra mắt năm 2022

HTML

• 
  Thẻ HTML
• 
  Thẻ HTML
• 
  Thuộc tính sự kiện HTML
• 
  Thẻ HTML
• 
  Thẻ HTML
• 
  HTML SSE API