Sử dụng thẻ đầu vào HTML và thẻ nút trong biểu mẫu

Bằng cách đặt loại thuộc tính thành nút "", một nút có thể nhấp đơn giản sẽ được tạo. Bạn có thể xác định văn bản sẽ xuất hiện trên nút, chẳng hạn như "Gửi" bằng cách sử dụng thuộc tính giá trị .

Ví dụ:

Lưu ý rằng thẻ sẽ không gửi biểu mẫu HTML; bạn sẽ vẫn cần phải bao gồm JavaScript để xử lý việc gửi dữ liệu biểu mẫu. Nếu không có sự kiện onclick JavaScript, nút sẽ xuất hiện để có thể nhấp nhưng không có gì sẽ xảy ra và bạn sẽ làm bạn thất vọng.

Nút & lt; & gt; Thay thế thẻ

Mặc dù sử dụng thẻ đầu vào để tạo một nút hoạt động cho mục đích của nó, nó là một tùy chọn tốt hơn để sử dụng thẻ để tạo các nút HTML trang web của bạn. Thẻ linh hoạt hơn vì nó cho phép bạn sử dụng hình ảnh cho nút (giúp bạn duy trì tính nhất quán trực quan nếu trang web của bạn có chủ đề thiết kế) và có thể được định nghĩa là nút gửi hoặc đặt lại của nút mà không cần thêm JavaScript.

Bạn sẽ muốn chỉ định thuộc tính loại nút trong bất kỳ thẻ

nào. Có ba loại khác nhau:

• nút - Nút không có hành vi vốn có nhưng được sử dụng kết hợp với các tập lệnh chạy trên phía máy khách có thể được gắn vào nút và được thực hiện khi được nhấp.
• reset - Đặt lại tất cả các giá trị.
• submit - Nút gửi dữ liệu biểu mẫu tới máy chủ (giá trị mặc định này nếu không có kiểu nào được xác định).

Các thuộc tính khác bao gồm:

• name - Cung cấp cho nút một tên tham chiếu.
• value - Chỉ định một giá trị ban đầu được gán cho nút.
• vô hiệu hóa - Tắt nút.

HTML5 thêm một số thuộc tính bổ sung vào thẻ

cung cấp cho bạn nhiều chức năng hơn.

• tự động lấy nét - Khi tải trang, điều này chỉ định rằng nút này là tiêu điểm. Chỉ có thể sử dụng tự động lấy nét trên một trang.
• biểu mẫu - Liên kết nút có biểu mẫu trong cùng một tài liệu HTML, sử dụng số nhận dạng của biểu mẫu dưới dạng giá trị. Ví dụ:

Gửi

formaction - Chỉ được sử dụng với type = "submit" và một URL làm giá trị, nó chỉ định nơi dữ liệu biểu mẫu sẽ được gửi đi. Ví dụ:

Gửi dữ liệu biểu mẫu tới trang khác

formenctype - Chỉ được sử dụng với thuộc tính type = "submit" . Xác định cách dữ liệu biểu mẫu được mã hóa khi được gửi tới máy chủ. Ba giá trị là application / x-www-form-urlencoded (mặc định), multipart / form-data và text / plain.

formmethod - Chỉ được sử dụng với thuộc tính type = "submit" . Điều này chỉ định phương thức HTTP nào sẽ sử dụng khi gửi dữ liệu biểu mẫu, nhận hoặc đăng.

formnovalidate - Chỉ được sử dụng với thuộc tính type = "submit" . Dữ liệu biểu mẫu sẽ không được xác thực khi được gửi.

formtarget - Chỉ được sử dụng với thuộc tính type = "submit" . Điều này cho biết vị trí phản hồi trang web sẽ được hiển thị khi dữ liệu biểu mẫu được gửi, chẳng hạn như trong cửa sổ mới, v.v. Tùy chọn giá trị là _blank, _self, _parent, _top hoặc tên khung cụ thể.

Nếu bạn đang sử dụng biểu mẫu, bạn có thể muốn đọc về cách tạo các nút trong biểu mẫu HTML và cách làm cho trang web của bạn thân thiện với người dùng hơn.