easyui1.3.2中使用1.3.6或1.4.x的calendar首先在1.3.2中calendar控件不支持日历某天的颜色进行改变，和自定义回调函数
NameTypeDescriptionDefaultwidth
number
The width of calendar component.
180
height
number
The height of calendar component.
180
fit
boolean
When true to set the calendar size fit it's parent container.
false
border
boolean
Defines if to show the border.
true
firstDay
number
Defines the first day of week. Sunday is 0, Monday is 1, ...
0
weeks
array
The list of week to be showed.
['S','M','T','W','T','F','S']
months
array
The list of month to be showed.
['Jan', 'Feb', 'Mar', 'APR', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
year
number
The year of calendar. The example below shows how to create a calendar using the specified year and month.<div class="easyui-calendar" data-options="year:2012,month:6" />
current year(four digits)
month
number
The month of calendar.
current month, start with 1
current
Date
The current date.
current date
formatter
function(date)
The day formatter function, return the day value. This property is available since version 1.3.6.Code example:
$('#cc').calendar({formatter: function(date){return date.getDate();}})
styler
function(date)
The styler function for calendar days, return the inline style or CSS class. This property is available since version 1.3.6.Code example:
$('#cc').calendar({styler: function(date){if (date.getDay() == 1){return 'background-color:#ccc';// the function can return predefined css class and inline style// return {class:'r1', style:{'color:#fff'}};} else {return '';}}})
validator
function(date)
The validator function that is used to determine if a calendar day can be selected, return false to prevent from selecting a day. This property is available since version 1.3.6.Code example:
$('#cc').calendar({validator: function(date){if (date.getDay() == 1){return true;}else {return false;}}})
以上看出上面的有些方法和属性注明在1.3.6中使用 那我们使用以前的老版本怎么办？
因为页面上还有其它使用1.3.2的方法和属性。所以只有自己从easyui官方最新的插件包中查找了，经过整理了一下代码如下：
(function ($) { function _4ef(_4f0, _4f1) { var opts = $.data(_4f0, "calendar").options; var t = $(_4f0); if (_4f1) { $.extend(opts, { width: _4f1.width, height: _4f1.height }); } t._size(opts, t.parent()); t.find(".calendar-body")._outerHeight(t.height() - t.find(".calendar-header")._outerHeight()); if (t.find(".calendar-menu").is(":visible")) { _4f2(_4f0); } }; function init(_4f3) { $(_4f3).addClass("calendar").html("<div class=\"calendar-header\">" + "<div class=\"calendar-prevmonth\"></div>" + "<div class=\"calendar-nextmonth\"></div>" + "<div class=\"calendar-prevyear\"></div>" + "<div class=\"calendar-nextyear\"></div>" + "<div class=\"calendar-title\">" + "<span>Aprial 2010</span>" + "</div>" + "</div>" + "<div class=\"calendar-body\">" + "<div class=\"calendar-menu\">" + "<div class=\"calendar-menu-year-inner\">" + "<span class=\"calendar-menu-prev\"></span>" + "<span><input class=\"calendar-menu-year\" type=\"text\"></input></span>" + "<span class=\"calendar-menu-next\"></span>" + "</div>" + "<div class=\"calendar-menu-month-inner\">" + "</div>" + "</div>" + "</div>"); $(_4f3).find(".calendar-title span").hover(function () { $(this).addClass("calendar-menu-hover"); }, function () { $(this).removeClass("calendar-menu-hover"); }).click(function () { var menu = $(_4f3).find(".calendar-menu"); if (menu.is(":visible")) { menu.hide(); } else { _4f2(_4f3); } }); $(".calendar-prevmonth,.calendar-nextmonth,.calendar-prevyear,.calendar-nextyear", _4f3).hover(function () { $(this).addClass("calendar-nav-hover"); }, function () { $(this).removeClass("calendar-nav-hover"); }); //$(_4f3).find(".calendar-nextmonth").click(function () { // _4f5(_4f3, 1); //}); //$(_4f3).find(".calendar-prevmonth").click(function () { // _4f5(_4f3, -1); //}); //$(_4f3).find(".calendar-nextyear").click(function () { // _4f8(_4f3, 1); //}); //$(_4f3).find(".calendar-prevyear").click(function () { // _4f8(_4f3, -1); //}); $(_4f3).bind("_resize", function (e, _4f4) { if ($(this).hasClass("easyui-fluid") || _4f4) { _4ef(_4f3); } return false; }); }; function _4f5(_4f6, _4f7) { var opts = $.data(_4f6, "calendar").options; opts.month += _4f7; if (opts.month > 12) { opts.year++; opts.month = 1; } else { if (opts.month < 1) { opts.year--; opts.month = 12; } } show(_4f6); var menu = $(_4f6).find(".calendar-menu-month-inner"); menu.find("td.calendar-selected").removeClass("calendar-selected"); menu.find("td:eq(" + (opts.month - 1) + ")").addClass("calendar-selected"); }; function _4f8(_4f9, _4fa) { var opts = $.data(_4f9, "calendar").options; opts.year += _4fa; show(_4f9); var menu = $(_4f9).find(".calendar-menu-year"); menu.val(opts.year); }; function _4f2(_4fb) { var opts = $.data(_4fb, "calendar").options; $(_4fb).find(".calendar-menu").show(); if ($(_4fb).find(".calendar-menu-month-inner").is(":empty")) { $(_4fb).find(".calendar-menu-month-inner").empty(); var t = $("<table class=\"calendar-mtable\"></table>").appendTo($(_4fb).find(".calendar-menu-month-inner")); var idx = 0; for (var i = 0; i < 3; i++) { var tr = $("<tr></tr>").appendTo(t); for (var j = 0; j < 4; j++) { $("<td class=\"calendar-menu-month\"></td>").html(opts.months[idx++]).attr("abbr", idx).appendTo(tr); } } $(_4fb).find(".calendar-menu-prev,.calendar-menu-next").hover(function () { $(this).addClass("calendar-menu-hover"); }, function () { $(this).removeClass("calendar-menu-hover"); }); $(_4fb).find(".calendar-menu-next").click(function () { var y = $(_4fb).find(".calendar-menu-year"); if (!isNaN(y.val())) { y.val(parseInt(y.val()) + 1); _4fc(); } }); $(_4fb).find(".calendar-menu-prev").click(function () { var y = $(_4fb).find(".calendar-menu-year"); if (!isNaN(y.val())) { y.val(parseInt(y.val() - 1)); _4fc(); } }); $(_4fb).find(".calendar-menu-year").keypress(function (e) { if (e.keyCode == 13) { _4fc(true); } }); $(_4fb).find(".calendar-menu-month").hover(function () { $(this).addClass("calendar-menu-hover"); }, function () { $(this).removeClass("calendar-menu-hover"); }).click(function () { var menu = $(_4fb).find(".calendar-menu"); menu.find(".calendar-selected").removeClass("calendar-selected"); $(this).addClass("calendar-selected"); _4fc(true); }); } function _4fc(_4fd) { var menu = $(_4fb).find(".calendar-menu"); var year = menu.find(".calendar-menu-year").val(); var _4fe = menu.find(".calendar-selected").attr("abbr"); if (!isNaN(year)) { opts.year = parseInt(year); opts.month = parseInt(_4fe); show(_4fb); } if (_4fd) { menu.hide(); } }; var body = $(_4fb).find(".calendar-body"); var sele = $(_4fb).find(".calendar-menu"); var _4ff = sele.find(".calendar-menu-year-inner"); var _500 = sele.find(".calendar-menu-month-inner"); _4ff.find("input").val(opts.year).focus(); _500.find("td.calendar-selected").removeClass("calendar-selected"); _500.find("td:eq(" + (opts.month - 1) + ")").addClass("calendar-selected"); sele._outerWidth(body._outerWidth()); sele._outerHeight(body._outerHeight()); _500._outerHeight(sele.height() - _4ff._outerHeight()); }; function _501(_502, year, _503) { var opts = $.data(_502, "calendar").options; var _504 = []; var _505 = new Date(year, _503, 0).getDate(); for (var i = 1; i <= _505; i++) { _504.push([year, _503, i]); } var _506 = [], wee