Question

我正在开发Web应用程序，在这个应用程序中我使用了jquery datepicker插件。我使用datepicker作为内联datepicker。当我选择一个日期时，我试图删除一个css类ui-state-highlight，但没有反映在datepicker中。

    $("#start_date").datepicker({
    beforeShowDay: greySelectedDateRange, 
    maxDate: 0,
    onSelect: function (dateText, inst) {
        console.log(dateText);
        var toDaysDate = getCurrrentDate('mdy'); //function returning current date
        console.log(toDaysDate);
        //When the selected date is equal to current date 
        if (dateText == toDaysDate) {
            $(this).find('a.ui-state-active')
                   .removeClass('ui-state-highlight')
                   .find('.ui-datepicker-today a')); 
             //$(this).datepicker("refresh");
            //console.log($(this));
        }
    }
});

当我看到控制台console.log($(this));时，它已被删除，但是当我检查时，css类（ui-state-highlight）仍在那里，请建议我一个解决方案。

提前致谢。

Answer 1

@Johan和@Stano建议的方法有效 - 但是一旦你改变月份然后再回到当前月份，今天的亮点就会返回。这个小小的修改解决了这个问题：

$(function() {
   $( ".datepicker" ).datepicker({    
     beforeShow: function(input, inst) {clearToday(inst)},
     onChangeMonthYear: function(year, month, inst) {clearToday(inst)}
   });

   function clearToday(inst) {
        setTimeout(function() {
            inst.dpDiv.find('a.ui-state-highlight').removeClass('ui-state-highlight');
        }, 10);
}

我发现我必须将超时时间减少到10，否则一天会突然显示闪烁并且可见。

Answer 2

尝试

inst.dpDiv.removeClass('ui-state-highlight');

inst.dpDiv是生成的datepicker div。

http://jsfiddle.net/abhMH/2/

Answer 3

我想知道他们是否在onSelect被触发后添加了CSS类。

您可以做的一件事是检查为ui-state-highlight设置的属性，然后在代码中的其他位置覆盖它们：

.ui-state-highlight {
  margin: 0 !important;
}

jquery datepicker删除.ui-state-highlight类onSelect事件

3 个答案: