突出显示jquery UI datepicker中的日期

前端之家收集整理的这篇文章主要介绍了突出显示jquery UI datepicker中的日期前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我如何使用beforeShowDay来突出显示jQuery UI datepicker中的日子。我有以下日期数组
Array
(
    [0] => 2011-07-07
    [1] => 2011-07-08
    [2] => 2011-07-09
    [3] => 2011-07-10
    [4] => 2011-07-11
    [5] => 2011-07-12
    [6] => 2011-07-13
)

解决方法

看看文档。

07000 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.

这意味着您需要创建一个函数,该函数获取日期并返回一个值为数组的参数数组:

> boolean – 表示是否可以选择日期
> string – 将被提交到日期的css类的名称
> string – 此日期的可选弹出工具提示

这里是一个例子:

var your_dates = [new Date(2011,7,7),new Date(2011,8)]; // just some dates.

$('#whatever').datepicker({
   beforeShowDay: function(date) {
      // check if date is in your array of dates
      if($.inArray(date,your_dates)) {
         // if it is return the following.
         return [true,'css-class-to-highlight','tooltip text'];
      } else {
         // default
         return [true,'',''];
      }
   }
});

现在您可以添加风格来突出显示日期

<style>
   .css-class-to-highlight{
       background-color: #ff0;
   }
</style>

猜你在找的jQuery相关文章