JAVASCRIPT
jquery 달력 스크립트 커스텀마이징 원하는 요일만 나오게
단모모
2023. 9. 21. 18:19
728x90
selectableDays 배열 값으로 원하는 요일만 선택이 가능하게 설정 하는 스크립트 예제
요일은 일요일이 0 부터 시작 되게 해서 작성 하면 됩니다.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>
<body>
<input type="text" id="datepicker">
<script>
$(document).ready(function() {
var selectableDays = [1, 2, 3]; // 월요일, 화요일, 수요일
$("#datepicker").datepicker({
beforeShowDay: function(date) {
var day = date.getDay();
if ($.inArray(day, selectableDays) >= 0) {
return [true];
}
return [false];
}
});
});
</script>
</body>
</html>beforeShowDay 함수에서 date 에 true, false 로 속성을 주어서 수정할 수 있는 부분으로 유용하게 사용 할수 있습니다.
jquery 사용이 많이 줄어들고 있는 추세 지만 달력 스크립트는 간단하게 붙이고 수정이 용이해서 아직 까지는 장점도 있는거 같습니다.
728x90