Thuộc tính autofocus của Input Range trong HTML DOM

Thuộc tính autofocus của HTML DOM Input Range liên kết với thuộc tính autofocus của phần tử HTML <input>. Thuộc tính này dùng để thiết lập hoặc trả về xem thanh trượt range có tự động lấy focus khi tải trang hay không.

Cú pháp

Cú pháp để thiết lập thuộc tính autofocus:

rangeObject.autofocus = true|false

Ở đây, true biểu thị thanh trượt nên lấy focus, false ngược lại. Mặc định là false.

Ví dụ

Ví dụ minh họa cho thuộc tính autofocus của Input Range:

<!DOCTYPE html> <html> <body> 
<h1>Thuộc tính autofocus của Input Range</h1> 
<form> 
<input type="range" id="RANGE1" name="VOL" autofocus> 
</form> 
<br> 
<button type="button" onclick="rangeFocus()">KIỂM TRA</button> 
<p id="Sample"></p> 
<script> 
    function rangeFocus() { 
        var R = document.getElementById("RANGE1").autofocus; 
        document.getElementById("Sample").innerHTML = "Thuộc tính autofocus được thiết lập là: "+R; 
    } 
</script> </body> </html>

Kết quả

Đoạn mã trên sẽ tạo ra kết quả như sau:

Khi nhấn nút KIỂM TRA:

Trong ví dụ trên:

Chúng ta tạo trường input trong form với type="range", id="RANGE1", name="VOL" và autofocus=true:

<form> <input type="range" id="RANGE1" name="VOL" autofocus> </form>

Tạo nút KIỂM TRA thực thi phương thức rangeFocus() khi được nhấn:

<button type="button" onclick="rangeFocus()">KIỂM TRA</button>

Phương thức rangeFocus() lấy phần tử range bằng getElementById() và lấy thuộc tính autofocus. Thuộc tính trả về true/false tùy giá trị autofocus. Gán cho biến R và hiển thị trong đoạn văn id="Sample":

function rangeFocus() { 
    var R = document.getElementById("RANGE1").autofocus; 
    document.getElementById("Sample").innerHTML = "Thuộc tính autofocus được thiết lập là: "+R; 
}