Question

我不知道这叫什么，我觉得像重置......

案件是这样的：我正在使用内联日期选择器，然后我将一个具有自己样式（css）的新类添加到datepicker中的某个日期。以下是代码：

$("#calendar").datepicker({ 
                            showOtherMonths: true, 
                            onSelect:function(){
                                                alert($(this).val());
                                                }
                            });
$(document).ready(function(){
    customDate();
});                         
function customDate(){
    $("#calendar a:eq(10)").addClass("has_event");
}

上面的代码将在第10个索引'a'元素添加新类，该类的样式为：

.has_event{
    color:#bb0000 !important;
    font-weight:bold !important;
    background:#cccccc !important;
}

customDate（）函数最初运行良好，但是在选择了datepicker之后，样式将重置为默认值，因为添加的新类已经消失。

所以任何人都知道如何在选择之后甚至在onSelect事件之后阻止datepicker重置？

@ S.M.09这就是我所做的：

_selectDay:function(id,month,year,td){var target=$(id);if($(td).hasClass(this._unselectableClass)||this._isDisabledDatepicker(target[0])){return}var inst=this._getInst(target[0]);inst.selectedDay=inst.currentDay=$("a",td).html();inst.selectedMonth=inst.currentMonth=month;inst.selectedYear=inst.currentYear=year;if(inst.stayOpen){inst.endDay=inst.endMonth=inst.endYear=null}this._selectDate(id,this._formatDate(inst,inst.currentDay,inst.currentMonth,inst.currentYear));if(inst.stayOpen){inst.rangeStart=this._daylightSavingAdjust(new Date(inst.currentYear,inst.currentMonth,inst.currentDay));this._updateDatepicker(inst)} if(id=="#calendar"){$("#calendar a:eq(10)").addClass("has_event");}}

Answer 1

在jQuery js（jquery-ui-x.x.x.custom.min.js）中......你会发现一个带有四个参数的函数（变量名称可以因版本而异），名为

_selectDay:function(a,b,c,d)

在函数结束之前添加代码

if(a=="#calendar"){
$("#calendar a:eq(10)").addClass("has_event");
}

如果您想要全局删除if condition ...上面的代码只会将其应用于您想要的日历

修改

_selectDay:function(a,b,c,e){ var f=d(a); if(!(d(e).hasClass(this._unselectableClass)||this._isDisabledDatepicker(f[0]))){ f=this._getInst(f[0]); f.selectedDay=f.currentDay=d("a",e).html(); f.selectedMonth=f.currentMonth=b; f.selectedYear=f.currentYear=c; this._selectDate(a,this._formatDate(f,f.currentDay,f.currentMonth,f.currentYear)) } if(a=="#calendar"){ $("#calendar a:eq(10)").addClass("has_event"); } },

Answer 2

你通常希望有些日子的风格不同，你可以把它们放在一个数组中（是持久的和动态的）

var myDates = [9,13];

并使用beforeShowDay ^docs事件检查使用数组呈现的每一天

 beforeShowDay:function(date) {
                      var thisDay = date.getDate();

                      return [1,((myDates.indexOf(thisDay))>-1)?'has_event':''];
                    }

这适用于td，因此您需要将css更改为.has_event a{..

演示： http://jsfiddle.net/gaby/dTRNf/

在onSelect事件之后阻止JQuery datepicker重置

2 个答案: