Thuộc tính tự động lấy nét vô tuyến đầ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 trả lại xem nút radio đầu vào có tự động được 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.
radioObject.autofocus = true|false
Ở đây, true đại diện cho nút radio nên lấy tiêu điểm và false đại diện cho ngược lại. Nó được đặt thành false theo mặc định.
Ví dụ
Chúng ta hãy xem một ví dụ cho thuộc tính lấy nét tự động của Input Radio -
<!DOCTYPE html>
<html>
<body>
<h1>Input password autofocus property</h1>
<form>
RADIO: <input type="radio" id="rad1" name=”BTN” autofocus>
</form>
<br><br>
<button type=”button” onclick="FocusVal()">CHECK FOCUS</button>
<p id="Sample"></p>
<script>
function FocusVal() {
var R = document.getElementById("rad1").autofocus;
document.getElementById("Sample").innerHTML = "The radio button has autofocus property
set to "+R;
}
</script>
</body>
</html> Đầu ra
Điều này sẽ tạo ra kết quả sau -
Khi nhấp vào nút KIỂM TRA TẬP TRUNG -
Trong ví dụ trên -
Chúng tôi đã tạo một trường đầu vào với type =“radio”, id =“rad1”, name =“BTN” và nó đã bật thuộc tính lấy nét tự động, tức là được đặt thành true -
Password: <input type="password" id="rad1" name=”BTN”autofocus>
Sau đó, chúng tôi đã tạo một nút CHECK FOCUS sẽ thực thi phương thức FocusVal () khi người dùng nhấp vào -
<button type=”button” onclick="FocusVal()">CHECK FOCUS</button>
Phương thức FocusVal () nhận phần tử đầu vào có kiểu radio bằng cách sử dụng phương thức getElementById () và nhận thuộc tính tự động lấy nét của nó. 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 tự động lấy nét của nút radio. Giá trị này được gán cho biến R 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 R = document.getElementById("rad1").autofocus;
document.getElementById("Sample").innerHTML = "The radio button has autofocus property set to "+R;
}