jQuery UI datepicker 사용자 정의 월

Question

ui datepicker에서 매월 사용자 정의해야합니다. 즉, 매월 다른 배경 이미지가 표시됩니다. 나는 다음 달에 할 생각 :

<div class="calendar-container CURRENT-MONTS-CLASS"><div id="datepicker"></div></div> 

나는 달 당일의 이름을 얻고 그것을 datepicker의 컨테이너에 추가 할 수 있습니까?

어떤 도움을 주셔서 감사합니다.

Answer 1

다음과 같이 월 번호를 사용할 수 있습니다. .month1 - .month12 또는 .monthJanuary - .monthDecember (또는 다른 형식) ... 개인적으로 다른 문화권의 번호를 붙이 겠지만 두 가지 방법으로이 대답을 적용 할 수 있습니다. 나는 위의 개월 수를 사용하고 있기 때문에합니다 (날짜 선택기를 만든 후) 페이지가로드, 그것과 같을 것이다 때

$('#datepicker').datepicker({ 
    onChangeMonthYear: function(year, month, inst) { 
     //Month number (1-12) is month 
     //Month name you can get by $("#datepicker .ui-datepicker-month").text() 
     $(this).closest("div.calendar-container") 
       .removeClass().addClass("calendar-container month" + month); 
    } 
}); 

을 그리고 처음에 설정 :이 같은 날짜 선택기의 onChangeMonthYear event를 사용

을

$("div.calendar-container").addClass("month" + ($('#datepicker').datepicker("getDate").getMonth()+1)); 

대신 이름을 사용한 경우는, 사용

당신이 가고 어느 옵션

$("div.calendar-container").addClass("month" + $("#datepicker .ui-datepicker-month").text()); 

, 그냥 당신이 원하는 스타일링/배경 이미지와 함께 12 개 클래스를 만들 수 있습니다. You can test it out here. 실제로 날짜 선택기 자체로 배경을 원한다면, 아니 그냥 CSS 셀렉터가 추가 것 .calendar-container<div> 즉, 예를 들어,보다 구체적으로 만들려면 :

.month1 .ui-datepicker-inline { background: url(January.jpg); } 

You can test out that version here합니다.