突出显示整周的日期选择器

我有一个function齐全的日期选择器，可以选择整个开始工作周（周一至周五）。 我现在要做的是将它进一步扩展，以便在我点击特定的一周时。 它将突出整个。 我有它的paritally工作，看起来如下： Calandar preivew 。 可以看出，我遇到的问题是，对我来说，表格行似乎是奇数，偶数，奇数偶数。 至于第一周，我突出显示行以红色突出显示，细胞以黄色突出显示。 然后是工作罚款的那一周，然后如果我选择一周之后，那将会重复。 我试过检查jquery-ui-1.8.4.custom.css和jquery-ui.css，但没有运气。 似乎让我困惑的是为什么细胞以黄色突出显示？ 代码遵循我的datepicker。

使用Javascript：

$(function() { var startDate; var endDate; var selectCurrentWeek = function() { window.setTimeout(function () { $('.week-picker').find('.ui-datepicker-current-day a').addClass('ui-state-active')}, 1); } function check(d) { if(d.length() == 2) { dd = d; return dd; } else { dd = "0" + myDateParts[0]; return dd; } } var selectedWeek;//remember which week the user selected here $('.week-picker').datepicker( { beforeShowDay: $.datepicker.noWeekends, showOtherMonths: true, selectOtherMonths: true, onSelect: function(dateText, inst) { var date = $(this).datepicker('getDate'); startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 1); endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6); var dateFormat = 'yy-mm-dd' var newDate = $('#startDate').text($.datepicker.formatDate( dateFormat, startDate, inst.settings )); var oldDate = document.getElementById('startDate'); var date_textnode = oldDate.firstChild; var date_text = date_textnode.data; myDateParts = date_text.split("-"); var dd = myDateParts[2]; var mm = myDateParts[1]; var yy = myDateParts[0]; selectCurrentWeek(); window.location.href = "/timesheet?week_commencing=" + yy + "-" + mm + "-" + dd; }, beforeShowDay: function(date) { var cssClass = ''; if(date >= startDate && date  A $(".ui-datepicker-calendarr-day").siblings().find('a').addClass('white'); }); $('.week-picker .ui-datepicker-calendar tr').live('mousemove', function() { $(this).find('td a').addClass('ui-state-hover'); }); $('.week-picker .ui-datepicker-calendar tr').live('mouseleave', function() { $(this).find('td a').removeClass('ui-state-hover'); }); }); 

HTML

 
 Hours for Week commencing:  
  

CSS

 .highlight { border: 1px solid red; } .white { background: white !important; } 

我试过看下面的stackoverflow问题相关的stackoverflow 。 没有运气，因为链接被破坏，并尝试在JSfiddle中查看它。 除此之外，我设置我的日期选择器的方式也不同。

我正试图让我的日历像这样工作但是出于某种原因，当我尝试这样做时，我得到以下内容。 这与css有关吗？

UPDATE2

日历和Firebug输出

Answer 1

这是你想要的吗？

http://jsfiddle.net/william/YQ2Zw/2/

有几件事情出了问题：

ui-datepicker-current-day类被应用于

元素，所以它只需要向上移动一级来找到

，所以我带走了一个对parent()调用：

 $(".ui-datepicker-current-day").parent().addClass('highlight'); 

您可以使用ui-datepicker-current-day类设置多天。 这就是为什么我需要使用:eq(0)选择器来只选择第一个元素：

 $(".ui-datepicker-current-day:eq(0)").siblings().find('a').addClass('white'); 

此外，您正在为上述声明调用错误的类。