Để kiểm tra định dạng ngày hợp lệ, hãy khớp ngày với -
const dateFormat = /^\d{4}\-\d{2}\-\d{2}$/; Ví dụ
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initialscale=1.0">
<title>Document</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<style>
.check-valid-date {
border: 1px solid red;
}
</style>
</head>
<body>
<input type="date" id="check-valid-date" class="form-control
calender-black" name="dateCalender">
<script>
const dateFormat = /^\d{4}\-\d{2}\-\d{2}$/;
document.getElementById("check-valid-date").addEventListener("change",
checkingForValidDate);
function checkingForValidDate() {
console.log(this.value, dateFormat.test(this.value));
this.classList.toggle('check-valid-date',
dateFormat.test(this.value));
}
</script>
</body>
</html> Để chạy chương trình trên, hãy lưu tên tệp “anyName.html (index.html)” và nhấp chuột phải vào tệp. Chọn tùy chọn “Mở bằng Máy chủ Trực tiếp” trong trình chỉnh sửa Mã VS.
Đầu ra
Điều này sẽ tạo ra kết quả sau -
Bây giờ, tôi đang chọn một ngày. Ảnh chụp nhanh như sau -
Phía trên, bảng điều khiển hiển thị ĐÚNG, tức là định dạng ngày hợp lệ.