액션
onClickDate()
Type: Function
Default: null
Options: onClickDate(self, event) => void | null
new Calendar('#calendar', {
onClickDate(self, event) {},
});캘린더에서 특정 날짜를 클릭한 뒤 실행됩니다. 다음 파라미터를 받을 수 있습니다:
self- 초기화된 캘린더에 대한 참조;event- 마우스 이벤트.
각 날짜 HTML 요소에는 YYYY-MM-DD 형식의 전체 날짜를 담은 data 속성이 포함되어 있습니다.
일, 월, 연도를 별도로 얻고 싶다면 표준 JS 메서드를 사용할 수 있습니다.
예: new Date('2022-11-07').getDate()는 7을 반환합니다.
onClickWeekDay()
Type: Function
Default: null
Options: onClickWeekDay(self, day, dateEls, event) => void | null
new Calendar('#calendar', {
onClickWeekDay(self, day, dateEls, event) {},
});캘린더에서 요일을 클릭한 뒤 실행됩니다. 다음 파라미터를 받을 수 있습니다:
self- 초기화된 캘린더에 대한 참조;day- 요일;dateEls- 날짜 요소(HTML)의 배열;event- 마우스 이벤트.
onClickWeekNumber()
Type: Function
Default: null
Options: onClickWeekNumber(self, number, year, dateEls, event) => void | null
new Calendar('#calendar', {
onClickWeekNumber(self, number, year, dateEls, event) {},
});캘린더에서 주 번호를 클릭한 뒤 실행됩니다. 이 메서드가 동작하려면 enableWeekNumbers 파라미터가 true로 설정되어 있어야 합니다. 다음 파라미터를 받을 수 있습니다:
self- 초기화된 캘린더에 대한 참조;number- 주 번호;year- 해당 주의 연도;dateEls- 날짜 요소(HTML)의 배열;event- 마우스 이벤트.
onClickTitle()
Type: Function
Default: null
Options: onClickTitle(self, event) => void | null
new Calendar('#calendar', {
onClickTitle(self, event) {},
});캘린더에서 월 또는 연도 제목을 클릭한 뒤 실행됩니다. 다음 파라미터를 받을 수 있습니다:
self- 초기화된 캘린더에 대한 참조;event- 마우스 이벤트.
onClickMonth()
Type: Function
Default: null
Options: onClickMonth(self, event) => void | null
new Calendar('#calendar', {
onClickMonth(self, event) {},
});캘린더에서 월을 선택한 뒤 실행됩니다. 다음 파라미터를 받을 수 있습니다:
self- 초기화된 캘린더에 대한 참조;event- 마우스 이벤트.
onClickYear()
Type: Function
Default: null
Options: onClickYear(self, event) => void | null
new Calendar('#calendar', {
onClickYear(self, event) {},
});캘린더에서 연도를 선택한 뒤 실행됩니다. 다음 파라미터를 받을 수 있습니다:
self- 초기화된 캘린더에 대한 참조;event- 마우스 이벤트.
onClickArrow()
Type: Function
Default: null
Options: onClickArrow(self, event) => void | null
new Calendar('#calendar', {
onClickArrow(self, event) {},
});캘린더에서 화살표를 클릭한 뒤 실행됩니다. 다음 파라미터를 받을 수 있습니다:
self- 초기화된 캘린더에 대한 참조;event- 마우스 이벤트.
onChangeTime()
Type: Function
Default: null
Options: onChangeTime(self, event, isError) => void | null
new Calendar('#calendar', {
onChangeTime(self, event) {},
});캘린더에서 시간이 변경된 뒤 실행됩니다. 다음 파라미터를 받을 수 있습니다:
self- 초기화된 캘린더에 대한 참조;event- 변경 이벤트;isError- 사용자가 잘못된 시간을 입력했으면true를 반환합니다.
onChangeToInput()
Type: Function
Default: null
Options: onChangeToInput(self, event) => void | null
new Calendar('#calendar', {
onChangeToInput(self, event) {},
});이 메서드가 동작하려면 inputMode 파라미터가 true로 설정되어 있어야 합니다.
캘린더에서 날짜를 클릭하거나 어떤 방식으로든 시간이 변경된 뒤 실행됩니다.
다음 파라미터를 받을 수 있습니다:
self- 초기화된 캘린더에 대한 참조;event- 이벤트.
onCreateDateRangeTooltip()
Type: Function
Default: null
Options: onCreateDateRangeTooltip(self, dateEl, tooltipEl, dateElBCR, mainElBCR) => void | null
new Calendar('#calendar', {
onCreateDateRangeTooltip(self, dateEl, tooltipEl, dateElBCR, mainElBCR) {},
});날짜 범위 툴팁을 만들 수 있습니다. selectionDatesMode 파라미터가 'multiple-ranged'로 설정되어 있으면 날짜 클릭 및 호버 시 동작합니다.
다음 파라미터를 받을 수 있습니다:
self- 초기화된 캘린더에 대한 참조.dateEl- 날짜 HTML 요소;tooltipEl- 툴팁 HTML 요소;dateElBCR- 날짜 HTML 요소의 위치 및 크기에 대한 정보 객체;mainElBCR- 캘린더 메인 HTML 요소의 위치 및 크기에 대한 정보 객체.
onCreateDateEls()
Type: Function
Default: null
Options: onCreateDateEls(self, dateEl) => void | null
new Calendar('#calendar', {
onCreateDateEls(self, dateEl) {},
});이 메서드는 캘린더 초기화 및 변경 시점에 실행됩니다. 각 날짜에 대한 정보에 접근할 수 있습니다. 다음 파라미터를 받을 수 있습니다:
self- 초기화된 캘린더에 대한 참조;dateEl- 날짜 HTML 요소.
onCreateMonthEls()
Type: Function
Default: null
Options: onCreateMonthEls(self, monthEl) => void | null
new Calendar('#calendar', {
onCreateMonthEls(self, monthEl) {},
});이 메서드는 캘린더 타입이 'month'로 설정되었을 때 실행됩니다. 사용자가 월 제목을 클릭하거나, type = 'month'로 초기화했을 때도 캘린더 타입이 'month'가 됩니다. 각 월에 대한 정보에 접근할 수 있습니다.
다음 파라미터를 받을 수 있습니다:
self- 초기화된 캘린더에 대한 참조;monthEl- 월 HTML 요소.
onCreateYearEls()
Type: Function
Default: null
Options: onCreateYearEls(self, yearEl) => void | null
new Calendar('#calendar', {
onCreateYearEls(self, yearEl) {},
});이 메서드는 캘린더 타입이 'year'로 설정되었을 때 실행됩니다. 사용자가 연도 제목을 클릭하거나, type = 'year'로 초기화했을 때도 캘린더 타입이 'year'가 됩니다. 각 연도에 대한 정보에 접근할 수 있습니다.
다음 파라미터를 받을 수 있습니다:
self- 초기화된 캘린더에 대한 참조;yearEl- 연도 HTML 요소.
onInit()
Type: Function
Default: null
Options: onInit(self) => void | null
new Calendar('#calendar', {
onInit(self) {},
});이 메서드는 캘린더 초기화 시 실행됩니다. inputMode 파라미터가 true인 경우, 캘린더가 처음 표시될 때 초기화되므로 그 시점에 실행됩니다.
self- 초기화된 캘린더에 대한 참조.
onUpdate()
Type: Function
Default: null
Options: onUpdate(self) => void | null
new Calendar('#calendar', {
onUpdate(self) {},
});이 메서드는 .update() 메서드로 캘린더를 업데이트/리셋할 때 실행됩니다.
self- 초기화된 캘린더에 대한 참조.
onDestroy()
Type: Function
Default: null
Options: onDestroy(self) => void | null
new Calendar('#calendar', {
onDestroy(self) {},
});이 메서드는 캘린더가 삭제될 때 실행됩니다.
self- 초기화된 캘린더에 대한 참조.
onShow()
Type: Function
Default: null
Options: onShow(self) => void | null
new Calendar('#calendar', {
onShow(self) {},
});이 메서드는 캘린더가 사용자에게 표시될 때 실행되며, inputMode 파라미터가 true인 경우에만 동작합니다.
self- 초기화된 캘린더에 대한 참조.
onHide()
Type: Function
Default: null
Options: onHide(self) => void | null
new Calendar('#calendar', {
onHide(self) {},
});이 메서드는 캘린더가 숨겨질 때 실행되며, inputMode 파라미터가 true인 경우에만 동작합니다.
self- 초기화된 캘린더에 대한 참조.