<div class="container-fluid">
<input id="theCalendar">
<div>
현재 날짜는 <b><span id="theCalendarOutput"></span></b> 입니다.
</div>
</div>
xxxxxxxxxx
.wj-calendar {
width: 28em;
}
@font-face {
font-family: 'S-CoreDream-3Light';
src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-3Light.woff') format('woff');
font-weight: normal;
font-style: normal;
}
body {
margin: 20px;
font-family: 'S-CoreDream-3Light';
}
xxxxxxxxxx
document.readyState === 'complete' ? init() : window.onload = init;
function init() {
// 달력
let theCalendar = new wijmo.input.Calendar('#theCalendar', {
valueChanged: () => showCurrentDate()
});
// 현재 선택된 날짜 보여주기
function showCurrentDate() {
let el = document.querySelector('#theCalendarOutput');
el.textContent = wijmo.Globalize.format(theCalendar.value, 'D');
}
showCurrentDate();
}