Thuộc tính sự kiện onfocus HTML

Thuộc tính sự kiện HTML onfocus được sử dụng khi một phần tử HTML lấy tiêu điểm trong tài liệu HTML.

Cú pháp

Sau đây là cú pháp -

<tagname onfocus=”script”></tagname>

Ví dụ

Hãy để chúng tôi xem một ví dụ về Thuộc tính sự kiện onfocus HTML -

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
   body {
      color: #000;
      height: 100vh;
      background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) no-repeat;
      text-align: center;
      padding: 20px;
   }
   textarea {
      border: 2px solid #fff;
      background: transparent;
      font-size: 1rem;
   }
   ::placeholder {
      color: #000;
      font-size: 1rem;
   }
</style>
</head>
<body>
<h1>HTML onfocus Event Attribute Demo</h1>
<textarea placeholder="Enter your message here" onfocus="focusFn()" rows='8' cols="50"></textarea>
<script>
   function focusFn() {
      document.querySelector('textarea').style.background = '#ffffff36';
   }
</script>
</body>
</html>

Đầu ra

Thuộc tính sự kiện onfocus HTML

Bây giờ, hãy nhập tin nhắn của bạn vào vùng văn bản để quan sát cách hoạt động của thuộc tính sự kiện onfocus.

Thuộc tính sự kiện onfocus HTML