Thuộc tính wrap trong HTML

Thuộc tính wrap của thẻ <textarea> chỉ định cách văn bản được ngắt dòng (wrap) khi form được submit.

Cú pháp

<textarea wrap="hard | soft"></textarea>

Giá trị:

• soft (mặc định): Văn bản hiển thị ngắt dòng trên màn hình, nhưng khi submit không gửi ký tự xuống dòng (gửi liền một dòng).
• hard: Văn bản hiển thị ngắt dòng VÀ khi submit gửi kèm ký tự xuống dòng (cr/lf) tại các vị trí ngắt dòng hiển thị. Yêu cầu thuộc tính cols.

Ví dụ

<!DOCTYPE html>
<html>
<style>
  body { color: #000; height: 100vh; }
  .btn { background: #db133a; border: none; height: 2rem; border-radius: 2px; width: 40%; display: block; color: #fff; outline: none; cursor: pointer; margin: 1rem 0; }
  .show { font-size: 1.5rem; margin: 1rem 0; }
</style>
<body>
<h1>Demo thuộc tính wrap</h1>
<form action="" method="post">
  <textarea rows="5" cols="40" wrap="soft">Dòng 1
Dòng 2
Dòng 3 - wrap=soft: submit không gửi ký tự xuống dòng</textarea>
  <input type="submit" class="btn" value="Submit Form (xem URL)">
</form>
<button onclick="showWrap()" class="btn">Xem giá trị wrap</button>
<div class="show"></div>
<script>
  function showWrap() {
    document.querySelector('.show').innerHTML = 'Giá trị wrap: ' + document.querySelector('textarea').wrap;
  }
</script>
</body>
</html>

Kết quả

Nhập nhiều dòng, nhấn Submit → xem URL: với wrap="soft", dữ liệu gửi liên tục không có %0D%0A (CRLF). Thử đổi wrap="hard" để thấy khác biệt.

Lưu ý: wrap="hard" bắt buộc có cols. Hầu hết form hiện đại xử lý newline ở server-side, ít dùng hard wrap.