Thẻ <input> trong HTML

Miêu tả

Thẻ HTML <input> được sử dụng trong một form để khai báo phần tử input - một điều khiển mà cho phép người sử dụng nhập dữ liệu đầu vào.

Ví dụ

<!DOCTYPE html>
<html>
<head>
<title>Vi du the input trong HTML</title>
</head>
<body>
<form action="/cgi-bin/hello_get.cgi" method="get">
First name: 
<input type="text" name="first_name" value="" maxlength="100" />
<br />
Last name: 
<input type="text" name="last_name" value="" maxlength="100" />
<input type="submit" value="Submit" />
</form>
</body>
</html>

Nó sẽ cho kết quả sau:

Quảng cáo

Các thuộc tính Global

Thẻ này hỗ trợ tất cả các thuộc tính Global được miêu tả trong chương: Tổng hợp thuộc tính trong HTML

Quảng cáo

Các thuộc tính đặc trưng

Thẻ HTML <input> cũng hỗ trợ các thuộc tính sau:

Thuộc tính	Giá trị	Miêu tả
accept	content types	Xác định danh sách các kiểu nội dung phân biệt nhau bởi dấu phảy mà server chấp nhận.
align	left right top middle bottom	Thuộc tính cũ- Định nghĩa sự căn chỉnh của nội dung.
alt	text	Xác định văn bản được sử dụng trong trường hợp agent trình duyệt/người sử dụng không thể render điều khiển đầu vào.
autocomplete	on off	Xác định có hay không autocomplete phần tử <input>.
autofocus	autofocus	Xác định rằng phần tử <input> nên tự động tìm trọng tâm khi trang load.
checked	checked	Nếu type="radio" hoặc type="checkbox" nó sẽ đã được chọn khi trang load.
disabled	disabled	Disable điều khiển đầu vào. Nút này sẽ không chấp nhận các thay đổi từ người sử dụng. Nó cũng không thể nhận trọng tâm và sẽ bị bỏ qua khi tab.
form	form_id	Xác định một hoặc nhiều form.
formaction	URL	Xác định địa chỉ URL của file mà sẽ xử lý điều khiển đầu vào khi form được chấp nhận.
formenctype	application/x-www-form-urlencoded multipart/form-data text/plain	Xác định cách dữ liệu form nên được mã hóa khi đệ trình nó tới server.
formmethod	post get	Định nghĩa cách thức để gửi dữ liệu tới URL hoạt động.
formnovalidate	formnovalidate	Định nghĩa rằng các phần tử form không nên hiệu lực khi được đệ trình.
formtarget	_blank _self _parent _top	Xác định mục tiêu, nơi mà phản hồi sẽ hiển thị, mà được nhận sau khi đệ trình form.
height	pixels	Specifies the height
list	datalist_id	Xác định phần tử <datalist> mà chứa các tùy chọn đã định trước cho một phần tử <input>.
max	autofocus	Xác định giá trị tối đa.
maxlength	Số	Xác định số ký tự tối đa được cho phép trong trường văn bản.
min	Số	Xác định giá trị nhỏ nhất.
multiple	multiple	Xác định rằng người sử dụng có thể nhập nhiều giá trị.
name	text	Assigns a name to the input control.
pattern	regexp	Xác định một biểu thức thường mà giá trị của phần tử <input> được kiểm tra.
placeholder	text	Xác định một chỉ dẫn (hint) ngắn mà miêu tả giá trị mong đợi.
readonly	readonly	Thiết lập điều khiển đầu vào là chỉ đọc (read-only). Nó sẽ không cho phép người sử dụng thay đổi giá trị. Điều khiển, tuy nhiên có thể nhận trọng tâm (focus) và được bao gồm khi tab thông qua điều khiển form.
required	required	Xác định rằng một trường input phải được điền đầy đủ trước khi đệ trình form.
size	Số	Xác định độ rộng của điều khiển. Nếu type="text" hoặc type="password", điều này liên quan đến độ rộng ký tự. Nếu không thì giá trị nó bằng pixel.
src	URL	Định nghĩa địa chỉ URL của hình ảnh để hiển thị. Chỉ được sử dụng cho type="image".
step	number	Xác định khoảng cách số hợp pháp cho một trường đầu vào.
type	button checkboxcolor date datetime datetime-local email file hidden image month Số password radio range reset search submit tel text time url week	Xác định kiểu của điều khiển.
value	text	Xác định giá trị khởi tạo cho điều khiển. Nếu type="checkbox" hoặc type="radio" thuộc tính này được yêu cầu.
width	pixels	Xác định độ rộng.

Quảng cáo

Các thuộc tính sự kiện

Thẻ này hỗ trợ tất cả các thuộc tính sự kiện được miêu tả trong chương: Tổng hợp sự kiện (Event) trong HTML

Trình duyệt hỗ trợ

Chrome	Firefox	IE	Opera	Safari	Android
Có	Có	Có	Có	Có	Có

Đã có app VietJack trên điện thoại, giải bài tập SGK, SBT Soạn văn, Văn mẫu, Thi online, Bài giảng....miễn phí. Tải ngay ứng dụng trên Android và iOS.

Theo dõi chúng tôi miễn phí trên mạng xã hội facebook và youtube:

Follow fanpage của team https://www.facebook.com/vietjackteam/ hoặc facebook cá nhân Nguyễn Thanh Tuyền https://www.facebook.com/tuyen.vietjack để tiếp tục theo dõi các loạt bài mới nhất về Java,C,C++,Javascript,HTML,Python,Database,Mobile.... mới nhất của chúng tôi.

Bài học HTML phổ biến khác tại vietjack.com: