Trong bài viết này, Ứng dụng free sẽ cùng các bạn tìm hiểu về Form Trrong HTML5

FORM TRONG HTML5

Khái Niệm:

• Form nhập liệu là một phần đặc biệt trong trang web, chúng ta sử dụng form để thu nhập thông tin từ người dùng. Form có thể chứa rất nhiều các thành phần HTML mà người dùng có thể sử dụng để nhập thông tin vào.
• Các thành phần mới của form HTML5 bổ sung thêm chức năng mà các nhà thiết kế cũng như các nhà phát triển web thường phải kết hợp thông qua các phương tiện khác như JavaScript và Flash 
• Cách làm việc của form:

Tạo khung form nhập liệu với thẻ HTML:

• Cấu trúc mà form:

• • ID: cho phép định kiểu form với CSS
  • Action: 
    • Nới gửi dữ liệu của người dùng để xử lý
    • Thường là URL trỏ tới mà kịch bản được lưu trên máy chủ
  • Method:
    • Xác định phương thức gửi dữ liệu 
    • Giá trị POST/GET

Các thành phần hỗ trợ nhập liệu:

• Làm việc với thành phần <label>:
  • Thẻ HTML <label> dùng để định nghĩa tiêu đề cho một thẻ HTML <input>, khi trình duyệt xử lý HTML <label> không có gì khác với văn bản thông thường ngoại trừ việc người dùng có thể nhấp chuột vào tiêu đề và con trỏ chuột sẽ nhảy vào ô nhập liệu tương ứng. Chú ý: thuộc tính for của thẻ HTML <label> phải bằng thuộc tính id của thẻ <input> tương ứng. 
  • Là thành phần không bắt buộc
  • Tăng khả năng truy cập cho form

• Làm việc với thành phần <fieldset>:
  • Để nhóm các phần tử form trên trang
  • Kết hợp với thành phần <legend> để thêm tiêu đề cho form

• Thêm điều khiển <input> mới và thuộc tính:

• • Cho phép các nhà thiết kế sắp xếp dữ liệu từ các website một cách dễ dàng
  • Dữ liệu có thể được gửi tự động tới một cơ sở dữ liệu xác định

• Làm việc với thành phần <datalist>:
  • Xác định một danh sách tùy chọn cho thành phần input

• Một số thành phần mới trong điều khiển input:
  • HTML5 có thêm rất nhiều các dạng nhập liệu mới cho thẻ HTML <input>, nó giúp bạn xây dựng form nhập liệu rất phong phú với nội dung cần thu thập mà không cần phải sử dụng đến các thư viện của bên thứ 3.
  • Color: Thẻ <input> dạng chọn mã màu, khi bấm vào sẽ hiển thị một cửa sổ mới và có thể chọn màu với các mã màu trong đó.
  • Date: Thẻ <input> dạng date dùng để chọn ngày tháng năm.

KẾT LUẬN: Nếu như bạn chưa hiểu nội dung bài viết hoặc đang khúc mắc khi thao tác thì hãy bình luận phía dưới bài viết để Ứng dụng free   giải đáp thắc mắc nhé! Cảm ơn các bạn đã theo dõi bài viết.

26/09/2022 Blog Tin Học