Rate this post

Textarea trong HTML là một thành phần của mẫu (form) trong HTML, nó tạo ra một trường nhập văn bản có nhiều dòng. Nó được khai báo bằng thẻ <textarea> và có thể có nhiều thuộc tính như số dòng, số cột và giá trị mặc định. Ví dụ:

<textarea rows="4" cols="50">
Nhập tin nhắn của bạn tại đây...
</textarea>

Điều này sẽ tạo ra một textarea có 4 dòng và 50 cột, với giá trị mặc định “Nhập tin nhắn của bạn tại đây…”.

Các thuộc tính của textarea trong html

Các thuộc tính cơ bản của thẻ <textarea> trong HTML bao gồm:

  • rows: Số dòng của trường nhập văn bản.
  • cols: Số cột của trường nhập văn bản.
  • name: Tên của trường nhập văn bản, sử dụng cho việc xử lý dữ liệu khi gửi mẫu.
  • disabled: Khóa trường nhập văn bản nếu có giá trị “disabled”
  • readonly: Cho phép chỉ đọc trường nhập văn bản nếu có giá trị “readonly”
  • required: Yêu cầu người dùng nhập vào trường nhập văn bản nếu có giá trị “required”
  • placeholder: Hiển thị một chuỗi giả mạo trong trường nhập văn bản cho biết gì người dùng cần nhập vào.
  • wrap: Xác định cách xử lý khi người dùng nhập văn bản quá số dòng hoặc cột.

Ngoài ra còn có các thuộc tính khác như autofocus, maxlength, form, accesskey… nhưng không phải là bắt buộc.

Ví dụ về sử dụng textarea trong html

Ví dụ về sử dụng thẻ <textarea> trong HTML:

<form action="submit-form.php" method="post">
  <label for="message">Nhập tin nhắn của bạn:</label>
  <textarea id="message" name="message" rows="10" cols="30" 
            placeholder="Nhập tin nhắn tại đây"></textarea>
  <br>
  <input type="submit" value="Gửi">
</form>

Trong ví dụ trên, chúng ta tạo ra một mẫu gửi dữ liệu đến trang “submit-form.php” bằng phương thức “post”. Có một trường nhập văn bản được gắn với nhãn “Nhập tin nhắn của bạn”, với thuộc tính id=”message” , name=”message”, rows=”10″, cols=”30″ và placeholder=”Nhập tin nhắn tại đây”. Nút submit để gửi mẫu dữ liệu đi.

Nếu người dùng nhập vào trường nhập văn bản và nhấn nút gửi, dữ liệu sẽ được gửi đến trang “submit-form.php” với tham số “message” chứa nội dung tin nhắn mà người dùng đã nhập.

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Contact Me on Zalo
Call now