Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> HTML

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

Thuộc tính autofocus của <input type="month"> cho phép trả về hoặc thiết lập việc input tháng có tự động nhận focus khi trang tải xong hay không.

Cú pháp

Lấy giá trị:

monthInput.autofocus

Thiết lập giá trị:

monthInput.autofocus = true | false

Ví dụ: Tắt autofocus bằng nút bấm

<!DOCTYPE html>
<html>
<head>
    <title>HTML DOM autofocus property</title>
    <style>
        body { text-align: center; font-family: sans-serif; padding: 20px; }
        p { font-size: 1.5rem; color: #ff8741; }
        input[type="month"] { padding: 8px; }
        button {
            background-color: #dc3545; color: white; padding: 8px 16px;
            border: none; width: 120px; margin: 10px; border-radius: 25px;
            outline: none; cursor: pointer;
        }
    </style>
</head>
<body>
    <h1>Ví dụ autofocus Property</h1>
    <p>Nhấn nút Disable để tắt autofocus</p>
    <input type="month" autofocus value="2019-03">
    <br><br>
    <button onclick="disableAutofocus()">Tắt autofocus</button>
    <script>
        function disableAutofocus() {
            document.querySelector("input").autofocus = false;
        }
    </script>
</body>
</html>

Kết quả

Khi tải trang, input month tự động focus:

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

Nhấn "Tắt autofocus" - lần tải sau sẽ không focus:

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

ℹ️ Lưu ý: Chỉ nên đặt autofocus cho **một** phần tử trên trang. Thay đổi bằng JS chỉ ảnh hưởng lần tải sau (reload), không ảnh hưởng ngay lập tức.