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

Thuộc tính min của <input type="month"> trả về hoặc thiết lập **tháng/năm nhỏ nhất** được phép chọn. Định dạng: YYYY-MM (VD: 2019-04).

Cú pháp

Lấy giá trị:

monthInput.min

Thiết lập giá trị:

monthInput.min = "YYYY-MM"

Ví dụ: Giới hạn chọn tháng từ 04/2019 đến 08/2019

<!DOCTYPE html>
<html>
<head>
    <style>
        html, body { height: 100%; margin: 0; font-family: sans-serif; }
        body {
            text-align: center; color: white;
            background: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) center/cover no-repeat;
        }
        input[type="month"] {
            display: block; width: 35%; margin: 15px auto;
            border: 2px solid white; background: transparent;
            color: white; font-weight: bold; padding: 8px;
        }
        .btn {
            background: #0197F6; border: none; color: white;
            padding: 10px 20px; border-radius: 4px; width: 35%;
            margin: 20px auto; display: block; cursor: pointer;
        }
        .show { font-size: 1.5rem; font-weight: bold; margin-top: 15px; }
    </style>
</head>
<body>
    <h1>Demo Input Month min/max Property</h1>
    <p>Cần nghỉ việc? Chọn 1 tháng giữa Tháng 4 và Tháng 8 năm 2019:</p>
    <input type="month" class="monthInput" min="2019-04" max="2019-08">
    <button onclick="showSelection()" class="btn">Xem kết quả</button>
    <div id="result" class="show"></div>
    <script>
        function showSelection() {
            var input = document.querySelector(".monthInput");
            var msg = document.getElementById("result");
            if (input.value === '') {
                msg.textContent = "Vui lòng chọn!";
            } else {
                msg.textContent = "Bạn chọn: " + input.value;
            }
        }
    </script>
</body>
</html>

Kết quả

Input month giới hạn min/max:

Chọn tháng trong khoảng cho phép (VD: 2019-06):

Nhấn "Xem kết quả":