Question

我使用jQuery Datepicker制作小日历小部件。我需要强调当前的一周非常简单：

<script>
$(document).ready(function(){
    $(".ui-datepicker-today").parent().addClass('current-week');
});
</script>

这很好但只是当我刷新页面时。选择任何日期后，当前周的亮点消失。有谁知道可能是什么问题？提前谢谢。

您可以在此处查看示例：jQuery Datepicker Calendar Widget

Answer 1

<script type="text/javascript">
 $(function() {
var startDate;
var endDate;

var selectCurrentWeek = function() {
    window.setTimeout(function () {
        $('#ui-datepicker-div').find('.ui-datepicker-current-day a').addClass('ui-state-active')
    }, 1);
}

$('.datepicker').datepicker( {
    showOtherMonths: true,
    selectOtherMonths: true,
    onSelect: function(dateText, inst) { 
        var date = $(this).datepicker('getDate');
        startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay());
        endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 6);
        var dateFormat = inst.settings.dateFormat || $.datepicker._defaults.dateFormat;
        $(this).attr("value",$.datepicker.formatDate( dateFormat, startDate, inst.settings ));   
        selectCurrentWeek();
    },
    beforeShowDay: function(date) {
        var cssClass = '';
        if(date >= startDate && date <= endDate)
            cssClass = 'ui-datepicker-current-day';
        return [true, cssClass];
    },
    onChangeMonthYear: function(year, month, inst) {
        selectCurrentWeek();
    }
});

$('#ui-datepicker-div .ui-datepicker-calendar tr').live('mousemove', function() { $(this).find('td a').addClass('ui-state-hover'); });
$('#ui-datepicker-div .ui-datepicker-calendar tr').live('mouseleave', function() { $(this).find('td a').removeClass('ui-state-hover'); });
  });
  </script>

Answer 2

点击一天之后它没有添加课程，所以看看这是否有帮助

$(".ui-datepicker-current-day").click(function(){
$(this).parent().addClass('current-week');
});

jQuery Datepicker突出显示当前周不能正常工作

2 个答案: