在jQuery datepicker中突出顯示每週的特定日期

Question

我的目的是突出顯示jQuery datepicker中每週的特定日子。

例如，我想強調星期二和星期四。我見過很多例子，如何突出特定日期（請參閱：http://jquerybyexample.blogspot.com/2012/05/highlight-specific-dates-in-jquery-ui.html）。但沒有一個能夠滿足我的需求。

任何提示？

強尼

Answer 1

你能適應你鏈接的例子，做你想做的，是這樣的：

CSS：

.Highlighted a{ 
    background-color : Green !important; 
    background-image :none !important; 
    color: White !important; 
    font-weight:bold !important; 
    font-size: 12pt; 
} 

的Javascript：

$(document).ready(function() { 
    $('#datepicker').datepicker({ 
     beforeShowDay: function(date) { 
      var day = date.getDay(); 
      if (day == 2 || day == 4) { 
       return [true, "Highlighted", date]; 
      } 
      return [true, '', '']; 
     } 
    }); 
});​ 

應做到這一點。

Answer 2

如果您可以假定星期從週日開始，那麼您可以僅使用CSS來使用+相鄰選擇器。它可能看起來有點荒謬，但它可以在任何支持+和:first-child（其中包括IE7及更高版本）的瀏覽器中運行。

/* Tuesday:    Su    Mo Tu   */ 
.ui-datepicker-calendar tr td:first-child + td + td a, 
/* Thursday:    Su    Mo Tu We Th */ 
.ui-datepicker-calendar tr td:first-child + td + td + td + td a { 
    background:red; 
} 
​ 

演示：http://jsfiddle.net/jnGhV/1/

Answer 3

這應做到：

$(document).ready(function() { 
    $('#txtDate').datepicker({ 
     beforeShowDay: function(date) { 
      if(date.getDay() == 2 || date.getDay() == 4) { 
       return [true, "Highlighted", '']; 
      } else { 
       return [true, '', '']; 
      } 

     } 
    }); 
});​ 

的jsfiddle：http://jsfiddle.net/XuExp/