Thẻ <đầu vào> HTML
Ví dụ
Một biểu mẫu HTML có ba trường đầu vào; hai trường văn bản và một nút gửi:
<form
action="/action_page.php">
<label for="fname">First name:</label>
<input type="text"
id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text"
id="lname" name="lname"><br><br>
<input type="submit" value="Submit">
</form>
Hãy tự mình thử »Định nghĩa và cách sử dụng
Thẻ <input> chỉ định trường đầu vào nơi người dùng có thể nhập dữ liệu.
Phần tử <input> là phần tử biểu mẫu quan trọng nhất.
Phần tử <input> có thể được hiển thị theo nhiều cách, tùy thuộc vào thuộc tính type.
Các loại đầu vào khác nhau như sau:
-
<input type="button"> -
<input type="checkbox"> -
<input type="color"> -
<input type="date"> -
<input type="datetime-local"> -
<input type="email"> -
<input type="file"> -
<input type="hidden"> -
<input type="image"> -
<input type="month"> -
<input type="number"> -
<input type="password"> -
<input type="radio"> -
<input type="range"> -
<input type="reset"> -
<input type="search"> -
<input type="submit"> -
<input type="tel"> -
<input type="text">(giá trị mặc định) -
<input type="time"> -
<input type="url"> -
<input type="week">
Nhìn vào thuộc tính type để xem ví dụ cho từng loại đầu vào!
Lời khuyên và ghi chú
Mẹo: Luôn sử dụng thẻ <label> để xác định nhãn cho <input type="text"> , <input type="checkbox"> , <input type="radio"> , <input type="file"> và <input type="password"> .
Hỗ trợ trình duyệt
| Element | |||||
|---|---|---|---|---|---|
| <input> | Yes | Yes | Yes | Yes | Yes |
Thuộc tính
| Attribute | Value | Description |
|---|---|---|
| accept | file_extension audio/* video/* image/* media_type |
Specifies a filter for what file types the user can pick from the file input dialog box (only for type="file") |
| alt | text | Specifies an alternate text for images (only for type="image") |
| autocomplete | on off |
Specifies whether an <input> element should have autocomplete enabled |
| autofocus | autofocus | Specifies that an <input> element should automatically get focus when the page loads |
| checked | checked | Specifies that an <input> element should be pre-selected when the page loads (for type="checkbox" or type="radio") |
| dirname | inputname .dir | Specifies that the text direction will be submitted |
| disabled | disabled | Specifies that an <input> element should be disabled |
| form | form_id | Specifies the form the <input> element belongs to |
| formaction | URL | Specifies the URL of the file that will process the input control when the form is submitted (for type="submit" and type="image") |
| formenctype | application/x-www-form-urlencoded multipart/form-data text/plain |
Specifies how the form-data should be encoded when submitting it to the server (for type="submit" and type="image") |
| formmethod | get post |
Defines the HTTP method for sending data to the action URL (for type="submit" and type="image") |
| formnovalidate | formnovalidate | Defines that form elements should not be validated when submitted |
| formtarget | _blank _self _parent _top framename |
Specifies where to display the response that is received after submitting the form (for type="submit" and type="image") |
| height | pixels | Specifies the height of an <input> element (only for type="image") |
| list | datalist_id | Refers to a <datalist> element that contains pre-defined options for an <input> element |
| max | number date |
Specifies the maximum value for an <input> element |
| maxlength | number | Specifies the maximum number of characters allowed in an <input> element |
| min | number date |
Specifies a minimum value for an <input> element |
| minlength | number | Specifies the minimum number of characters required in an <input> element |
| multiple | multiple | Specifies that a user can enter more than one value in an <input> element |
| name | text | Specifies the name of an <input> element |
| pattern | regexp | Specifies a regular expression that an <input> element's value is checked against |
| placeholder | text | Specifies a short hint that describes the expected value of an <input> element |
| popovertarget | element_id | Specifies which popover element to invoke (only for type="button") |
| popovertargetaction | hide show toggle |
Specifies what happens to the popover element when you click the button (only for type="button") |
| readonly | readonly | Specifies that an input field is read-only |
| required | required | Specifies that an input field must be filled out before submitting the form |
| size | number | Specifies the width, in characters, of an <input> element |
| src | URL | Specifies the URL of the image to use as a submit button (only for type="image") |
| step |
number any |
Specifies the interval between legal numbers in an input field |
| type | button checkbox color date datetime-local file hidden image month number password radio range reset search submit tel text time url week |
Specifies the type <input> element to display |
| value | text | Specifies the value of an <input> element |
| width | pixels | Specifies the width of an <input> element (only for type="image") |
Thuộc tính chung
Thẻ <input> cũng hỗ trợ Thuộc tính chung trong HTML .
Thuộc tính sự kiện
Thẻ <input> cũng hỗ trợ Thuộc tính sự kiện trong HTML .
Trang liên quan
Hướng dẫn HTML:
- Biểu mẫu HTML
- Các phần tử biểu mẫu HTML
- Các kiểu nhập HTML
- Thuộc tính đầu vào HTML
- Biểu mẫu nhập HTML* Thuộc tính
Tham chiếu DOM HTML:
- Đối tượng nút đầu vào
- Đối tượng hộp kiểm đầu vào
- Đối tượng màu đầu vào
- Đối tượng ngày nhập
- Đối tượng ngày giờ đầu vào
- Đối tượng DatetimeLocal đầu vào
- Đối tượng email đầu vào
- Đối tượng tải lên tệp đầu vào
- Nhập đối tượng ẩn
- Đối tượng hình ảnh đầu vào
- Đối tượng tháng đầu vào
- Đối tượng nhập số
- Đối tượng nhập mật khẩu
- Đối tượng phạm vi đầu vào
- Đối tượng vô tuyến đầu vào
- Đối tượng đặt lại đầu vào
- Đối tượng tìm kiếm đầu vào
- Đối tượng gửi đầu vào
- Đối tượng văn bản đầu vào
- Đối tượng thời gian đầu vào
- Đối tượng URL đầu vào
- Đối tượng tuần đầu vào
Cài đặt CSS mặc định
Không có.
