Thuộc tính required của Textarea trong HTML DOM

Thuộc tính required của Textarea trong HTML DOM trả về và cho phép sửa đổi giá trị của thuộc tính required trên phần tử textarea trong tài liệu HTML.

Cú pháp

Cú pháp như sau:

1. Lấy giá trị required

object.required

2. Thiết lập required

object.required = true | false

Ví dụ

Dưới đây là ví dụ minh họa thuộc tính required của Textarea:

<!DOCTYPE html>
<html>
<head>
<title>Thuộc tính required của Textarea</title>
<style>
  body {
    text-align: center;
  }
  .btn {
    display: block;
    margin: 1rem auto;
    background-color: #db133a;
    color: #fff;
    border: 1px solid #db133a;
    padding: 0.5rem;
    border-radius: 50px;
    width: 20%;
  }
  .show-message {
    font-weight: bold;
    font-size: 1.4rem;
    color: #ffc107;
  }
</style>
</head>
<body>
<h1>Demo thuộc tính required của Textarea</h1>
<form id="form" method="post" action="">
  <fieldset>
    <legend>Biểu mẫu</legend>
    <textarea rows="5" cols="20" required placeholder="Nhập tin nhắn"></textarea>
    <input type="submit" class="btn" value="Gửi biểu mẫu" onclick="checkRequired()">
  </fieldset>
</form>
<div class="show-message"></div>
<script>
  function checkRequired() {
    var textarea = document.querySelector("textarea");
    if (textarea.value === "") {
      document.querySelector(".show-message").innerHTML = "Vui lòng nhập tin nhắn!";
    }
  }
</script>
</body>
</html>

Kết quả

Nhấn nút "Gửi biểu mẫu" mà không nhập tin nhắn nào vào textarea.