[英]how to change the jquery date-picker css for the unclickable date
我正在使用jQuery date- picker ,我希望我放在beforeShowDay函数中的日期列表应具有不同的颜色,并且也无法被选择或单击。...下面是一些代码
我有很多这个问题的谷歌....我发现了我的问题的一半解决方案...它更改了这些特殊日期的颜色,但可以单击,但我希望它们未被选中
<style type="text/css">
td.specialDay, table.ui-datepicker-calendar tbody td.specialDay a {
background: none !important;
background-color: #fffac2 !important;
color: black;
}
</style>
<script type="text/javascript">
var unavailableDates = ["30-7-2012","11-7-2012","15-8-2012"];
function unavailable(date) {
dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
if ($.inArray(dmy, unavailableDates) < 0) {
return [true,"","Book Now"];
} else {
return [true,"specialDay","Booked"];
}
}
$(function() {
$( "#datepicker" ).datepicker({
minDate: 0,
maxDate: "+3M +10D",
beforeShowDay: unavailable
});
});
</script>
如果有什么解决办法请告诉我...谢谢
在其他情况下,您需要提及false以使其无法选择
if ($.inArray(dmy, unavailableDates) < 0) {
return [true,"","Book Now"];
} else {
return [false,"specialDay","Booked"];
}
我发现了你的问题。 请检查dmy变量。 和正常工作的代码是
var unavailableDates = ["30-7-2012","11-7-2012","15-8-2012"];
function unavailable(date) {
var year, month, day, currDate;
year = String(date.getFullYear());
month = String(date.getMonth() + 1);
if (month.length === 1) {
month = "0" + month;
}
day = String(date.getDate());
if (day.length === 1) {
day = "0" + day;
}
dmy = String(day+'-'+month+'-'+year);
if ($.inArray(dmy, unavailableDates) < 0) {
return [true,"","Book Now"];
} else {
return [false,"specialDay","Booked"];
}
}
希望这会有所帮助
这对我有用...希望有这种问题的人也能帮助他们
下面在我的回答中,我强调了3分,因此
在第1步和第2步中,在第3步中添加此CSS,然后像这样编辑或复制粘贴
希望看到这种问题的任何人都能得到答案..如果没有,然后告诉我..如果我能解释更多
<style type="text/css">
.ui-state-active { //1.add this
background: blue !important;
}
.ui-state-active .ui-state-default{ //2. add this
background: red !important;
}
</style>
<script type="text/javascript">
var unavailableDates = ["30-7-2012","11-7-2012","15-8-2012"];
function unavailable(date) {
dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
if ($.inArray(dmy, unavailableDates) < 0) {
return [true,"","Book Now"];
} else {
return [false,"ui-state-active","booked"]; //3. edit here like this..
}
}
$(function() {
$( "#datepicker" ).datepicker({
minDate: 0,
maxDate: "+3M +10D",
beforeShowDay: unavailable
});
});
</script>
您在检查数组中的日期时遇到问题。 请检查此链接是否正常以及正确的操作方法。 希望对您有用
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.