HTML DOM Input Reset thuộc tính tự động lấy nét

Thuộc tính lấy nét tự động Đặt lại đầu vào HTML DOM được liên kết với thuộc tính lấy nét tự động của phần tử HTML . Thuộc tính này được sử dụng để thiết lập hoặc quay lại nếu nút đặt lại có được tự động lấy tiêu điểm khi trang tải hay không.

Cú pháp

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

Đặt thuộc tính lấy nét tự động -

resetObject.autofocus = true|false

Ở đây, true biểu thị rằng nút đặt lại sẽ lấy tiêu điểm và false biểu thị ngược lại. Nó được đặt thành false theo mặc định.

Ví dụ

Hãy cùng chúng tôi xem xét một ví dụ về thuộc tính lấy nét tự động Đặt lại đầu vào -

<!DOCTYPE html>
<html>
<body>
<h1> Reset Autofocus property</h1>
<form style="border:solid 2px green;padding:2px">
UserName: <input type="text" id="USR"> <br>
Location: <input type="text" id="Age"> <br><br>
<input type="reset" id="RESET1" autofocus>
</form>
<p>Get the reset button autofocus property value by clicking the below button</p>
<button type="button()" onclick="FocusVal()">CHECK</button>
<p id="Sample"></p>
<script>
   function FocusVal(){
      var f = document.getElementById("RESET1").autofocus;
      document.getElementById("Sample").innerHTML = "The reset button autofocus property is set to: "+f;
   }
</script>
</body>
</html>

Đầu ra

Điều này sẽ tạo ra kết quả sau -

HTML DOM Input Reset thuộc tính tự động lấy nét

Khi nhấp vào nút KIỂM TRA -

HTML DOM Input Reset thuộc tính tự động lấy nét

Trong ví dụ trên -

Chúng tôi đã tạo một phần tử với type =”reset”, id =”RESET1”. Nhấp vào nút này sẽ đặt lại dữ liệu biểu mẫu. Nút này bên trong biểu mẫu cũng chứa hai trường văn bản và biểu mẫu cũng có kiểu nội tuyến được áp dụng cho nó -

<form style="border:solid 2px green;padding:2px">
UserName: <input type="text" id="USR"> <br>
Location: <input type="text" id="Age"> <br><br>
<input type="reset" id="RESET1">
</form>

Sau đó, chúng tôi tạo nút KIỂM TRA sẽ thực thi phương thức FocusVal () khi được người dùng nhấp vào -

<button type="button()" onclick="FocusVal()">CHECK</button>

Phương thức FocusVal () nhận phần tử đầu vào có đặt lại kiểu bằng phương thức getElementById () và nhận thuộc tính lấy nét tự động. Thuộc tính lấy nét tự động trả về true và false tùy thuộc vào giá trị thuộc tính lấy nét tự động của nút đặt lại. Giá trị này được gán cho biến f và được hiển thị trong đoạn có id “Mẫu” bằng cách sử dụng thuộc tính innerHTML của nó -

function FocusVal(){
   var f = document.getElementById("RESET1").autofocus;
   document.getElementById("Sample").innerHTML = "The reset button autofocus property is set to: "+f;
}