有没有一种方法来设置jquery的datepicker天的样式? [英] Is there a way to style jquery's datepicker days?

问题描述

假设我希望2011年5月2日(或其他任何一天)的颜色与其他日子的颜色有所不同.这可能吗?

Let's say I want 5/2/2011 (or any other day) to be a different color than the rest of the days. Is this possible?

这是特定日期的示例项目

This is an example item for a particular day

<td class=" " onclick="DP_jQuery_1305738227207.datepicker._selectDay('#datepicker',4,2011, this);return false;"><a class="ui-state-default ui-state-hover" href="#">11</a></td>

我不知道是否有任何方法可以替代datepicker如何每天创建ID/类.

I don't know if there's any way to override how the datepicker creates ids/classes for each day.

推荐答案

工作示例: http://jsfiddle.net/hunter/UBPg5/

您可以通过添加beforeShowDay回调

绑定回调:

$("input:text.date").datepicker({
    beforeShowDay: SetDayStyle
});

使用一些错误日期的静态数组创建您的函数，或者在其他地方构造该数组:

Create your function with some static array of bad dates or construct this array somewhere else:

var badDates = new Array("5/2/2011");
function SetDayStyle(date) {
    var enabled = true;
    var cssClass = "";

    var day = date.getDate();
    var month = date.getMonth() + 1; //0 - 11
    var year = date.getFullYear();
    var compare = month + "/" + day + "/" + year;

    var toolTip = badDates.indexOf(compare) + " " + compare

    if (badDates.indexOf(compare) >= 0) cssClass = "bad";

    return new Array(enabled, cssClass, toolTip);
}

创建样式

.bad { background: red; }
.bad a.ui-state-active { background: red; color: white; }

---

http://jqueryui.com/demos/datepicker/#event-beforeShowDay

该函数将日期作为参数，并且必须返回一个数组，该数组的[0]等于true/false，表示是否可以选择该日期，[1]等于CSS类名或''默认演示文稿，以及[2]此日期的可选弹出工具提示.在日期选择器中的每一天都会调用它，然后再显示它.

The function takes a date as a parameter and must return an array with [0] equal to true/false indicating whether or not this date is selectable, [1] equal to a CSS class name(s) or '' for the default presentation, and [2] an optional popup tooltip for this date. It is called for each day in the datepicker before it is displayed.

这篇关于有没有一种方法来设置jquery的datepicker天的样式?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！