Categories HTML

Thuộc tính value trong thẻ input

Thuộc tính value là thuộc tính quan trọng trong thẻ input, chức năng của nó còn tùy thuộc vào loại thẻ input type cụ thể.

Code mẫu:

<form action="#"><label>Nam:<input name="gioi" type="radio" value="nam"></label><br><label>Nữ:<input name="gioi" type="radio" value="nu"></label><br><input type="submit" value="Gửi"></form>

Kết quả:




Trình duyệt hỗ trợ

Thuộc tính value được tất cả các trình duyệt phổ thông hỗ trợ, trong đó có Chrome, FireFox, Opera, Safari và IE.


Cách dùng

Như đã nói ở phần đầu tùy loại input mà thuộc tính value có tác dụng khác nhau:

A. Trong các nút reset và submit thì value có tác dụng hiển thị đoạn text trên nút nhấn. Ví dụ:

Code mẫu:

<form>
<input type="reset" value="Reset" />
<input type="submit" value="Submit" />
</form>

B. Cho input kiểu text, password và hidden thì value xác định giá trị ban đầu của trường. Ví dụ:

<label>Họ tên: <input type="text" value="Nguyễn Đức Anh" /></label>

C. Cho input kiểu checkbox, radio và image thì value xác định giá trị của các trường đó, và sẽ là thông tin được gửi đi khi submit. Ví dụ:

<label>Xe máy<input name="phuongtien" type="checkbox" value="xemay" /></label><br />
<label>Xe bus<input name="phuongtien" type="checkbox" value="xebus" /></label><br />
<label>Xe đạp<input name="phuongtien" type="checkbox" value="xedap" /></label><br />
<label>Đi bộ<input name="phuongtien" type="checkbox" value="dibo" /></label>

Các input type kiểu text, password hay hidden có thể không cần thuộc tính value vẫn OK, nhưng input kiểu checkbox và radio, thuộc tính value là bắt buộc, vì nếu không có thì nó sẽ gửi giá trị rỗng khi submit.

Thông tin cuối cùng, thuộc tính value không được phép sử dụng với:

<input type="file">
Back to Top