js日历算法
页面
<div class="un1">
<h2>服务档期</h2>
<div class="date-panel" style="height: 525px;">
<div class="bars">
<a href="javascript:void (0);" id="monthStart" class="b-l"></a>
<span class="b-c" id="monthInfo"></span>
<a href="javascript:void (0);" id="monthNext" class="b-r"></a>
</div>
<input type="hidden" id="shopId" value="34782e16-53d1-4c1c-b573-e82b0eae5d87" />
<input type="hidden" id="base" value="http://sc.izhaowo.com" />
<input type="hidden" id="schTname" value="ZHUCHIREN001" />
<table id="dateTable" class="picTable">
<tbody>
<tr>
<th>日</th>
<th>一</th>
<th>二</th>
<th>三</th>
<th>四</th>
<th>五</th>
<th>六</th>
</tr>
<tr>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
</tr>
<tr>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
</tr>
<tr>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
</tr>
<tr>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
</tr>
<tr>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
</tr>
<tr>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
<td id="home" valign="top"><span></span></td>
</tr>
</tbody>
</table>
</div>
</div> js代码：
/**
* Created by dengxu on 14-6-6.
*/
var today = new Date();
var thisMonth = today.getMonth()+;
var thisYear= today.getFullYear(); //日历
window.onload = function(){
viewSchedule();
} function viewSchedule (){
var table = document.getElementById("dateTable");
var yearS = document.getElementById("monthInfo");
var dayNum = ;
var fullMonth = thisMonth;
if(fullMonth<){
fullMonth = ""+(fullMonth);
}
yearS.innerHTML = thisYear+'年'+(fullMonth)+'月'; //初始化日期
var aTD = table.getElementsByTagName("TD");
//获取本月一号
today.setFullYear(thisYear);
today.setMonth(thisMonth-);
today.setDate();
//日期
dayNum = monthDay(thisYear,thisMonth);
//获取上一个月有多少天
var exDayNum = monthDay(thisYear,thisMonth-);
if(today.getDay()==) {
var i = ;
for (i; i < dayNum; i++) {
aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(i + )+'</span>';
}
var k = ;
for (i; i < ; i++) {
aTD[i].innerHTML = '<span id="'+(thisMonth+)+'">'+(k)+'</span>';
k++;
}
}else if(today.getDay()==) {
var n = exDayNum - ;
var i = ;
for (n; n <= exDayNum; n++) {
aTD[i].innerHTML = '<span id="'+(thisMonth-)+'">'+(n)+'</span>';
i++;
}
var j = ;
for (j; j < dayNum; j++) {
aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + )+'</span>';
i++;
}
var k = ;
for(i;i<;i++){
aTD[i].innerHTML = '<span id="'+(thisMonth+)+'">'+(k)+'</span>';
k++;
}
}else if(today.getDay()==) {
var n = exDayNum - ;
var i = ;
for (n; n <= exDayNum; n++) {
aTD[i].innerHTML = '<span id="'+(thisMonth-)+'">'+(n)+'</span>';
i++;
}
var j = ;
for (j; j < dayNum; j++) {
aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + )+'</span>';
i++;
}
var k = ;
for(i;i<;i++){
aTD[i].innerHTML = '<span id="'+(thisMonth+)+'">'+(k)+'</span>';
k++;
}
}else if(today.getDay()==) {
var n = exDayNum - ;
var i = ;
for (n; n <= exDayNum; n++) {
aTD[i].innerHTML = '<span id="'+(thisMonth-)+'">'+(n)+'</span>';
i++;
}
var j = ;
for (j; j < dayNum; j++) {
aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + )+'</span>';
i++;
}
var k = ;
for(i;i<;i++){
aTD[i].innerHTML = '<span id="'+(thisMonth+)+'">'+(k)+'</span>';
k++;
}
}else if(today.getDay()==) {
var n = exDayNum - ;
var i = ;
for (n; n <= exDayNum; n++) {
aTD[i].innerHTML = '<span id="'+(thisMonth-)+'">'+(n)+'</span>';
i++;
}
var j = ;
for (j; j < dayNum; j++) {
aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + )+'</span>';
i++;
}
var k = ;
for(i;i<;i++){
aTD[i].innerHTML = '<span id="'+(thisMonth+)+'">'+(k)+'</span>';
k++;
}
}else if(today.getDay()==) {
var n = exDayNum - ;
var i = ;
for (n; n <= exDayNum; n++) {
aTD[i].innerHTML = '<span id="'+(thisMonth-)+'">'+(n)+'</span>';
i++;
}
var j = ;
for (j; j < dayNum; j++) {
aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + )+'</span>';
i++;
}
var k = ;
for(i;i<;i++){
aTD[i].innerHTML = '<span id="'+(thisMonth+)+'">'+(k)+'</span>';
k++;
}
}else if(today.getDay()==) {
var n = exDayNum-;
var i = ;
for(n;n<=exDayNum;n++){
aTD[i].innerHTML = '<span id="'+(thisMonth-)+'">'+(n)+'</span>';
i++;
}
var j = ;
for(j;j<dayNum;j++){
aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + )+'</span>';
i++;
}
var k = ;
for(i;i<;i++){
aTD[i].innerHTML = '<span id="'+(thisMonth+)+'">'+(k)+'</span>';
k++;
}
}
//上一个月
function previous (){
var thisM = thisMonth;
var thisY= thisYear;
if(thisM==){
thisM = ;
thisY = thisY-;
}else{
thisM = thisM-;
}
thisYear = thisY;
thisMonth = thisM;
viewSchedule(); } //下一个月
function next (){
var thisM = thisMonth;
var thisY= thisYear;
if(thisM==){
thisM = ;
thisY = thisY+;
}else{
thisM = thisM+;
}
thisYear = thisY;
thisMonth = thisM;
viewSchedule(); } //是否为闰年
function isLeapYear(year){
if(year%== && year%!=){
return true;
}
else{
if(year%==){
return true;
}
else{
return false;
}
}
} //判断每月有几天
function monthDay(year,month){
if(month== || month== || month== || month== || month== || month== || month== || month==){
return ;
}else if(month== || month== || month== || month==){
return ;
}else if(month== && isLeapYear(year)){
return ;
}else{
return ;
}
} function nowDay(){
var monthStart = document.getElementById("monthStart");
var monthNext = document.getElementById("monthNext"); monthStart.onclick = function(){
previous();
}
monthNext.onclick = function(){
next();
}
}
nowDay();
setSchedule(table);
} //格式化日期,
function formatDate(date,format){
var paddNum = function(num){
num += "";
return num.replace(/^(\d)$/,"0$1");
}
//指定格式字符
var cfg = {
yyyy : date.getFullYear() //年 : 4位
,yy : date.getFullYear().toString().substring()//年 : 2位
,M : date.getMonth() + //月 : 如果1位的时候不补0
,MM : paddNum(date.getMonth() + ) //月 : 如果1位的时候补0
,d : date.getDate() //日 : 如果1位的时候不补0
,dd : paddNum(date.getDate())//日 : 如果1位的时候补0
,hh : date.getHours() //时
,HH : paddNum(date.getHours()) //时
,mm : paddNum(date.getMinutes()) //分
,ss : date.getSeconds() //秒
}
format || (format = "yyyy-MM-dd hh:mm:ss");
return format.replace(/([a-z])(\)*/ig,function(m){return cfg[m];});
} ////替换所有
//String.prototype.replaceAll = function(s1,s2) {
// return this.replace(new RegExp(s1, "gm"), s2); //g全局
//} var tdValue = ""; //设置档期
function setSchedule(obj){
var shopId = document.getElementById("shopId").value;
var base = document.getElementById("base").value;
//档期时间集合
var fullMonth = thisMonth;
if(fullMonth<){
fullMonth = ""+(fullMonth);
}
var scheduleList = "";
$.ajax({
url:base+'/schedule/doSchedule',
type:'post',
dateType:'json',
data:'shopId='+shopId+"&date="+thisYear+"-"+fullMonth+"-03",
timeout:*,
success:function(data){
//档期
var schedule = data.schedules;
//当前月份
var fullMonth;
var thisTd = obj.getElementsByTagName("TD"); for(var k = ;k<thisTd.length;k++){
var day = thisTd[k].getElementsByTagName("span")[].innerHTML;
//用于显示到日历上面
var day2 = thisTd[k].getElementsByTagName("span")[].innerHTML; fullMonth = thisTd[k].getElementsByTagName("span")[].id;
var tdHTML = thisTd[k];
if(day<){
day = ""+(day);
}
if(fullMonth<){
fullMonth = ""+(fullMonth);
} //今天
var thisDay = thisYear+"-"+fullMonth+"-"+day;
for(var i = ;i<schedule.length;i++){
for(var j = ;j<schedule[i].scheuleEvts.length;j++){
var thisDate = null;
if(schedule[i].workerSchedule.scheduleType==){
thisDate = formatDate(new Date(schedule[i].scheuleEvts[j].stime),"yyyy-MM-dd"); if(thisDay==thisDate){
tdHTML.innerHTML = "";
var serviceType = '<p>服务类型：'+schedule[i].scheuleEvts[j].serviceName+'</p>';
if($("#schTname").val() == "CEHUASHI001"){
serviceType = "";
}
if(schedule[i].scheuleEvts.length==||(j+)==schedule[i].scheuleEvts.length){
tdValue += '<p>预订人：'+schedule[i].scheuleEvts[j].contactName.substring(,)+'**</p>'+
serviceType+
'<p>服务价格：'+schedule[i].scheuleEvts[j].servicePrice/+'</p>'+
'<p>服务时间：'+formatDate(new Date(schedule[i].scheuleEvts[j].stime),"yyyy-MM-dd")+" - "+formatDateForHour(new Date(schedule[i].scheuleEvts[j].stime).getHours(),new Date(schedule[i].scheuleEvts[j].etime).getHours())+'</p> '+
'<p style="padding-left: 60px;">'+schedule[i].scheuleEvts[j].address.replace(",","-")+'</p> ';
}else{
tdHTML.getElementsByTagName("span")[].className = "cur";
tdHTML.innerHTML = tdHTML.innerHTML + '<i class="cur2">已预订</i>';
tdValue += '<p>预订人：'+schedule[i].scheuleEvts[j].contactName.substring(,)+'**</p>'+
serviceType+
'<p>服务价格：'+schedule[i].scheuleEvts[j].servicePrice/+'</p>'+
'<p>服务时间：'+formatDate(new Date(schedule[i].scheuleEvts[j].stime),"yyyy-MM-dd")+" - "+formatDateForHour(new Date(schedule[i].scheuleEvts[j].stime).getHours(),new Date(schedule[i].scheuleEvts[j].etime).getHours())+'</p> '+
'<p style="padding-left: 60px;">'+schedule[i].scheuleEvts[j].address.replace(",","-")+'</p> '+
'<p style="border-bottom:1px dashed #ddd; margin:5px 0px; *height:1px;"></p>';
}
}
}
}
if(schedule[i].workerSchedule.scheduleType==){
thisDate = formatDate(new Date(schedule[i].workerSchedule.date),"yyyy-MM-dd");
if(thisDay==thisDate){
//if(tdHTML.childNodes[0].nodeName == "SPAN"){
// day = thisTd[k].getElementsByTagName("span")[0].innerHTML;
// tdHTML.innerHTML = '<span class="gray" id="'+fullMonth+'">'+day+'</span>'
//
//}
tdHTML.getElementsByTagName("span")[].className = "cur";
tdHTML.getElementsByTagName("span")[].style.background = "#bfbfbf";
tdHTML.innerHTML = tdHTML.innerHTML + '<i class="cur2">今日忙</i>';
} } if(tdHTML.innerHTML==""){
tdHTML.innerHTML ='<span id="'+fullMonth+day+'" class="cur">'+day2+'</span>' +
'<i class="cur2">已预订</i>'+
'<div style="display: none;left:65px; top:-50px;" id="info'+fullMonth+day+'" class="buyInfo">'+tdValue+'</div>';
}
tdValue = "";
}
} },
error:function(){
// alert("对不起，请稍后再试！");
}
});
} function formatDateForHour(st,et){
if (st >= && et <= ) {
return "午宴";
}else if(st >= && et <= ) {
return "晚宴";
}else{
return "全天";
}
} 另一个js: var today = new Date();
var thisMonth = today.getMonth()+;
var thisYear= today.getFullYear(); //日历
window.onload = function(){
viewSchedule();
} function viewSchedule (){
var table = document.getElementById("dateTable");
var yearS = document.getElementById("monthInfo");
var dayNum = ;
var fullMonth = thisMonth;
if(fullMonth<){
fullMonth = ""+(fullMonth);
}
yearS.innerHTML = thisYear+'年'+(fullMonth)+'月'; //初始化日期
var aTD = table.getElementsByTagName("TD");
//获取本月一号
today.setFullYear(thisYear);
today.setMonth(thisMonth-);
today.setDate();
//日期
dayNum = monthDay(thisYear, thisMonth);
//获取当前月第一天是礼拜几
var monthfirstday = today.getDay();
for (var j = ; j < ; j++) {
aTD[j].innerHTML = '';
}
for (var i = ; i < dayNum; i++) {
aTD[i + monthfirstday].innerHTML = '<span id="' + (i + ) + '">' + (i + ) + '</span>';
}
//获取上一个月有多少天
var exDayNum = monthDay(thisYear, thisMonth - );
//if(today.getDay()==0) {
// var i = 0;
// for (i; i < dayNum; i++) {
// aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(i + 1)+'</span>';
// }
// var k = 1;
// for (i; i < 42; i++) {
// //aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
// k++;
// }
//}else if(today.getDay()==1) {
// var n = exDayNum - 0;
// var i = 0;
// for (n; n <= exDayNum; n++) {
// //aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
// i++;
// }
// var j = 0;
// for (j; j < dayNum; j++) {
// aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
// i++;
// }
// var k = 1;
// for(i;i<42;i++){
// //aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
// k++;
// }
//}else if(today.getDay()==2) {
// var n = exDayNum - 1;
// var i = 0;
// for (n; n <= exDayNum; n++) {
// //aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
// i++;
// }
// var j = 0;
// for (j; j < dayNum; j++) {
// aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
// i++;
// }
// var k = 1;
// for(i;i<42;i++){
// // aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
// k++;
// }
//}else if(today.getDay()==3) {
// var n = exDayNum - 2;
// var i = 0;
// for (n; n <= exDayNum; n++) {
// // aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
// i++;
// }
// var j = 0;
// for (j; j < dayNum; j++) {
// aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
// i++;
// }
// var k = 1;
// for(i;i<42;i++){
// // aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
// k++;
// }
//}else if(today.getDay()==4) {
// var n = exDayNum - 3;
// var i = 0;
// for (n; n <= exDayNum; n++) {
// // aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
// i++;
// }
// var j = 0;
// for (j; j < dayNum; j++) {
// aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
// i++;
// }
// var k = 1;
// for(i;i<42;i++){
// //aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
// k++;
// }
//}else if(today.getDay()==5) {
// var n = exDayNum - 4;
// var i = 0;
// for (n; n <= exDayNum; n++) {
// // aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
// i++;
// }
// var j = 0;
// for (j; j < dayNum; j++) {
// aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
// i++;
// }
// var k = 1;
// for(i;i<42;i++){
// // aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
// k++;
// }
//}else if(today.getDay()==6) {
// var n = exDayNum-5;
// var i = 0;
// for(n;n<=exDayNum;n++){
// //aTD[i].innerHTML = '<span id="'+(thisMonth-1)+'">'+(n)+'</span>';
// i++;
// }
// var j = 0;
// for(j;j<dayNum;j++){
// aTD[i].innerHTML = '<span id="'+thisMonth+'">'+(j + 1)+'</span>';
// i++;
// }
// var k = 1;
// for(i;i<42;i++){
// //aTD[i].innerHTML = '<span id="'+(thisMonth+1)+'">'+(k)+'</span>';
// k++;
// }
//}
//上一个月
function previous (){
var thisM = thisMonth;
var thisY= thisYear;
if(thisM==){
thisM = ;
thisY = thisY-;
}else{
thisM = thisM-;
}
thisYear = thisY;
thisMonth = thisM;
viewSchedule(); } //下一个月
function next (){
var thisM = thisMonth;
var thisY= thisYear;
if(thisM==){
thisM = ;
thisY = thisY+;
}else{
thisM = thisM+;
}
thisYear = thisY;
thisMonth = thisM;
viewSchedule(); } //是否为闰年
function isLeapYear(year){
if(year%== && year%!=){
return true;
}
else{
if(year%==){
return true;
}
else{
return false;
}
}
} //判断每月有几天
function monthDay(year,month){
if(month== || month== || month== || month== || month== || month== || month== || month==){
return ;
}else if(month== || month== || month== || month==){
return ;
}else if(month== && isLeapYear(year)){
return ;
}else{
return ;
}
} function nowDay(){
var monthStart = document.getElementById("monthStart");
var monthNext = document.getElementById("monthNext"); monthStart.onclick = function(){
previous();
}
monthNext.onclick = function(){
next();
}
}
nowDay();
setSchedule(table);
//$("#svrcitys").html(table);
} //格式化日期,
function formatDate(date,format){
var paddNum = function(num){
num += "";
return num.replace(/^(\d)$/,"0$1");
}
//指定格式字符
var cfg = {
yyyy : date.getFullYear() //年 : 4位
,yy : date.getFullYear().toString().substring()//年 : 2位
,M : date.getMonth() + //月 : 如果1位的时候不补0
,MM : paddNum(date.getMonth() + ) //月 : 如果1位的时候补0
,d : date.getDate() //日 : 如果1位的时候不补0
,dd : paddNum(date.getDate())//日 : 如果1位的时候补0
,hh : date.getHours() //时
,HH : paddNum(date.getHours()) //时
,mm : paddNum(date.getMinutes()) //分
,ss : date.getSeconds() //秒
}
format || (format = "yyyy-MM-dd hh:mm:ss");
return format.replace(/([a-z])(\)*/ig,function(m){return cfg[m];});
}
var tdValue = ""; //设置档期
function setSchedule(obj) {
var pUID = $("#pUID").val();
//var shopId = document.getElementById("shopId").value;
//var base = document.getElementById("base").value;
//档期时间集合
var fullMonth = thisMonth;
if (fullMonth < ) {
fullMonth = "" + (fullMonth);
}
var scheduleList = "";
var parameter = 'action=usercalendar&uid=' + pUID + '&thisYear=' + thisYear + '&fullMonth=' + fullMonth;
$.ajax({
type: "Post",
async: true,
cache: false,
url: "/ashx/web/web.ashx",
data: parameter,
dataType: "json",
success: function (data) {
//档期
// var schedule = data.schedules;
//当前月份
var fullMonth;
var thisTd = obj.getElementsByTagName("TD");
//for (var k = 0; k < thisTd.length; k++) {
// var day = thisTd[k].getElementsByTagName("span")[0].innerHTML;
// alert(day);
// //用于显示到日历上面
// var day2 = thisTd[k].getElementsByTagName("span")[0].innerHTML;
// fullMonth = thisTd[k].getElementsByTagName("span")[0].id;
// var tdHTML = thisTd[k];
// if (day < 10) {
// day = "0" + (day);
// }
// if (fullMonth < 10) {
// fullMonth = "0" + (fullMonth);
// }
// //今天
//var thisDay = thisYear + "-" + fullMonth + "-" + day;
// if (data.ObjDataList.length > 0) {
$.each(data.ObjDataList, function (i, item) {
var thisDate = item.MTSDate;
var d = new Date(thisDate);
var MTSState = item.MTSState;
var AMIsOrder = item.AMIsOrder;
var PMIsOrder = item.PMIsOrder;
var tday = d.getDate(); //if (thisDay == thisDate) {
//判断状态
//var busy = "";
//if (item.AMISBusy == 1 && item.PMISBusy == 1) {
// busy = "今日忙"; //}
//else {
// if (item.AMISBusy == 1) {
// busy = "上午忙";
// $("#" + tday).addClass("cur");
// $("#" + tday).css({ background: "#bfbfbf" });
// $("#" + tday).append('<i class="cur2">' + busy + '</i>');
// }
// else if (item.PMISBusy == 1) {
// busy = "下午忙";
// $("#" + tday).addClass("cur");
// $("#" + tday).css({ background: "#bfbfbf" });
// $("#" + tday).append('<i class="cur2">' + busy + '</i>');
// }
//}
//var yuding = "";
//if (AMIsOrder == 1 && PMIsOrder == 1) {
// yuding = "已预订";
//}
//else {
// if (AMIsOrder ==1)
// {
// yuding = "AM已约";
// }
// else if (PMIsOrder ==1)
// {
// yuding = "PM已约";
// }
//}
if (AMIsOrder == && item.MTSAM == "" && PMIsOrder == && item.MTSPM == "")
{
$("#" + tday).addClass("cur");
$("#" + tday).css({ background: "#bfbfbf" });
$("#" + tday).append('<i class="cur2">今日忙</i>');
}
else if (AMIsOrder == && item.MTSAM != "" && PMIsOrder == && item.MTSPM != "")
{
$("#" + tday).addClass("cur");
$("#" + tday).append('<i class="cur2">已预订</i>');
}
else if (AMIsOrder == && item.MTSAM == "")
{
$("#" + tday).addClass("cur");
$("#" + tday).css({ background: "#bfbfbf" });
$("#" + tday).append('<i class="cur2">上午忙</i>');
}
else if (PMIsOrder == && item.MTSPM == "") {
$("#" + tday).addClass("cur");
$("#" + tday).css({ background: "#bfbfbf" });
$("#" + tday).append('<i class="cur2">下午忙</i>');
}
else if (AMIsOrder == && item.MTSAM != "")
{
$("#" + tday).addClass("cur");
$("#" + tday).append('<i class="cur2">AM已约</i>');
}
else if (PMIsOrder == && item.MTSPM != "") {
$("#" + tday).addClass("cur");
$("#" + tday).append('<i class="cur2">PM已约</i>');
} //if (MTSState == 1) {
// //tdHTML.getElementsByTagName("span")[0].className = "cur";
// //tdHTML.getElementsByTagName("span")[0].style.background = "#bfbfbf";
// //tdHTML.innerHTML = tdHTML.innerHTML + '<i class="cur2">今日忙</i>';
// $("#" + tday).addClass("cur");
// $("#" + tday).css({ background: "#bfbfbf" });
// if (AMIsOrder == 1 && PMIsOrder == 1) {
// $("#" + tday).append('<i class="cur2">今日忙</i>');
// }
// else {
// if (AMIsOrder == 1)
// {
// $("#" + tday).append('<i class="cur2">上午忙</i>');
// }
// else if (PMIsOrder ==1)
// {
// $("#" + tday).append('<i class="cur2">下午忙</i>');
// }
// } //}
//else if (MTSState == 2) {
// //tdHTML.getElementsByTagName("span")[0].className = "cur";
// //tdHTML.innerHTML = tdHTML.innerHTML + '<i class="cur2">已预订</i>';
// $("#" + tday).addClass("cur");
// if (AMIsOrder == 1 && PMIsOrder == 1) {
// $("#" + tday).append('<i class="cur2">已预订</i>');
// }
// else {
// if (AMIsOrder == 1) {
// $("#" + tday).append('<i class="cur2">AM已约</i>');
// }
// else if (PMIsOrder == 1) {
// $("#" + tday).append('<i class="cur2">PM已约</i>');
// }
// } //}
//else {
// //tdHTML.getElementsByTagName("span")[0].className = "cur";
// //tdHTML.getElementsByTagName("span")[0].style.background = "#bfbfbf";
// //tdHTML.innerHTML = tdHTML.innerHTML + '<i class="cur2">今日忙</i>';
// $("#" + tday).addClass("cur");
// $("#" + tday).css({ background: "#bfbfbf" });
// $("#" + tday).append('<i class="cur2">今日忙</i>');
//}
// }
});
// }
//}
}
});
}
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>blog式日历控件_www.jb51.net_脚本之家</title>
</head>
<body>
<script type="text/javascript">
var $ = function (id) {
return "string" == typeof id ? document.getElementById(id) : id;
}; var Class = {
create: function () {
return function () {
this.initialize.apply(this, arguments);
}
}
} Object.extend = function (destination, source) {
for (var property in source) {
destination[property] = source[property];
}
return destination;
} var Calendar = Class.create();
Calendar.prototype = {
initialize: function (container, options) {
this.Container = $(container);//容器(table结构)
this.Days = [];//日期对象列表 this.SetOptions(options); this.Year = this.options.Year;
this.Month = this.options.Month;
this.SelectDay = this.options.SelectDay ? new Date(this.options.SelectDay) : null;
this.onSelectDay = this.options.onSelectDay;
this.onToday = this.options.onToday;
this.onFinish = this.options.onFinish; this.Draw();
},
//设置默认属性
SetOptions: function (options) {
this.options = {//默认值
Year: new Date().getFullYear(),//显示年
Month: new Date().getMonth() + ,//显示月
SelectDay: null,//选择日期
onSelectDay: function () { },//在选择日期触发
onToday: function () { },//在当天日期触发
onFinish: function () { }//日历画完后触发
};
Object.extend(this.options, options || {});
},
//上一个月
PreMonth: function () {
//先取得上一个月的日期对象
var d = new Date(this.Year, this.Month - , );
//再设置属性
this.Year = d.getFullYear();
this.Month = d.getMonth() + ;
//重新画日历
this.Draw();
},
//下一个月
NextMonth: function () {
var d = new Date(this.Year, this.Month, );
this.Year = d.getFullYear();
this.Month = d.getMonth() + ;
this.Draw();
},
//画日历
Draw: function () {
//用来保存日期列表
var arr = [];
//用当月第一天在一周中的日期值作为当月离第一天的天数
for (var i = , firstDay = new Date(this.Year, this.Month - , ).getDay() ; i <= firstDay; i++) { arr.push(" "); }
//用当月最后一天在一个月中的日期值作为当月的天数
for (var i = , monthDay = new Date(this.Year, this.Month, ).getDate() ; i <= monthDay; i++) { arr.push(i); } var frag = document.createDocumentFragment(); this.Days = []; while (arr.length > ) {
//每个星期插入一个tr
var row = document.createElement("tr");
//每个星期有7天
for (var i = ; i <= ; i++) {
var cell = document.createElement("td");
cell.innerHTML = " "; if (arr.length > ) {
var d = arr.shift();
cell.innerHTML = d;
if (d > ) {
this.Days[d] = cell;
//判断是否今日
if (this.IsSame(new Date(this.Year, this.Month - , d), new Date())) { this.onToday(cell); }
//判断是否选择日期
if (this.SelectDay && this.IsSame(new Date(this.Year, this.Month - , d), this.SelectDay)) { this.onSelectDay(cell); }
}
}
row.appendChild(cell);
}
frag.appendChild(row);
} //先清空内容再插入(ie的table不能用innerHTML)
while (this.Container.hasChildNodes()) { this.Container.removeChild(this.Container.firstChild); }
this.Container.appendChild(frag); this.onFinish();
},
//判断是否同一日
IsSame: function (d1, d2) {
return (d1.getFullYear() == d2.getFullYear() && d1.getMonth() == d2.getMonth() && d1.getDate() == d2.getDate());
}
}; </script>
<style type="text/css">
.Calendar {
font-family: Verdana;
font-size: 12px;
background-color: #e0ecf9;
text-align: center;
width: 200px;
height: 160px;
padding: 10px;
line-height: .5em;
} .Calendar a {
color: #1e5494;
} .Calendar table {
width: %;
border: ;
} .Calendar table thead {
color: #acacac;
} .Calendar table td {
font-size: 11px;
padding: 1px;
} #idCalendarPre {
cursor: pointer;
float: left;
padding-right: 5px;
} #idCalendarNext {
cursor: pointer;
float: right;
padding-right: 5px;
} #idCalendar td.onToday {
font-weight: bold;
color: #C60;
} #idCalendar td.onSelect {
font-weight: bold;
}
</style>
<div class="Calendar">
<div id="idCalendarPre"><<</div>
<div id="idCalendarNext">>></div>
<span id="idCalendarYear"></span>年 <span id="idCalendarMonth"></span>月
<table cellspacing="">
<thead>
<tr>
<td>日</td>
<td>一</td>
<td>二</td>
<td>三</td>
<td>四</td>
<td>五</td>
<td>六</td>
</tr>
</thead>
<tbody id="idCalendar"></tbody>
</table>
</div>
<script language="JavaScript"> var cale = new Calendar("idCalendar", {
SelectDay: new Date().setDate(),
onSelectDay: function (o) { o.className = "onSelect"; },
onToday: function (o) { o.className = "onToday"; },
onFinish: function () {
$("idCalendarYear").innerHTML = this.Year; $("idCalendarMonth").innerHTML = this.Month;
var flag = [, , ];
for (var i = , len = flag.length; i < len; i++) {
this.Days[flag[i]].innerHTML = "<a href='javascript:void(0);' onclick=\"alert('日期是:" + this.Year + "/" + this.Month + "/" + flag[i] + "');return false;\">" + flag[i] + "</a>";
}
}
}); $("idCalendarPre").onclick = function () { cale.PreMonth(); }
$("idCalendarNext").onclick = function () { cale.NextMonth(); } </script>
</body>
</html>
js日历算法的更多相关文章
- 简洁JS 日历控件 支持日期和月份选择
原文出处 以下这个JS日历控件是我的闲暇之余自己编写的,所有的代码全部在IE7/IE8/Firefox下面测试通过, 而且可以解决被iframe层遮盖的问题.现在只提供两种风格(简洁版和古典版)和两种 ...
- 百度的js日历
<title>百度的Js日历,值得一看</title> <style> body,td,.p1,.p2,.i{font-family:arial} body{mar ...
- JS日历控件优化(增加时分秒)
JS日历控件优化 在今年7月份时候 写了一篇关于 "JS日历控件" 的文章 , 当时只支持 年月日 的日历控件,现在优化如下: 1. 在原基础上 支持 yyyy ...
- Js 日期选择，可以的一个页面中重复使用本JS日历，兼容IE及火狐等主流浏览器，而且界面简洁、美观，操作体验也不错。
<html> <head> <title>Js日期选择器并自动加入到输入框中</title> <meta http-equiv="con ...
- JS日历控件集合----附效果图、源代码
http://www.cnblogs.com/yank/archive/2008/08/14/1267746.html 在进行开发的过程中,经常需要输入时间,特别是在进行查询.统计的时候,时间限定更为 ...
- js日历学习
<!DOCTYPE html><html><head><title>自己写的JS日历,适合学习</title><script src= ...
- 简洁js日历控件的使用
往Web工程添加纯js日历控件 在网上找到了DatePicker.js(http://www.cnblogs.com/shenyixin/archive/2013/03/11/2954156.html ...
- JS日历控件 灵活设置: 精确的时分秒.
在今年7月份时候 写了一篇关于 "JS日历控件" 的文章 , 当时仅仅支持 年月日 的日历控件,如今优化例如以下: 1. 在原基础上 支持 yyyy-mm-dd 的年月 ...
- js的 算法 和 数据结构
js的 算法 1.对一个对象数组按照对象某个属性进行排序 : https://www.cnblogs.com/webcabana/p/7460038.html 在做公交的项目中就碰到过这种算法问题, ...
随机推荐
- Pandas案例--人口密度分析
需求: 导入文件,查看原始数据 将人口数据和各州简称数据进行合并 将合并的数据中重复的abbreviation列进行删除 查看存在缺失数据的列 找到有哪些state/region使得state的值为N ...
- 【JMeter4.0】二、JMeter4.0安装与配置
二.安装配置JMeter jmeter是一个纯java工具,因此,JDK必不可少,现在最新版的jmeter是4.0,建议使用1.8及以上的JDK安装配置JDK,如没有,请见:[JMeter4.0]一. ...
- nginx各版本全自动编译安装脚本
#!/bin/bash #作者:星云法师(头条号:西西图图---专注美食领域的研究) #环境:centos7,如果是其它的系统可以相应做调整.#--------选择安装方式,网络晚装还是本地安装--- ...
- node egg | 部署报错：server got error：bind EADDRNOTAVAIL
egg框架实现的服务,部署在阿里云服务器上报出以下错误: 解决方案: config.js中 exports.cluster = { "listen": { "path&q ...
- Can't determine basedir from my_print_defaults mysqld
我的环境是:centos7 + mysql5.7.26,今天在用 mysqldumpslow 命令查看慢查询日志时出现下面的错误 [root@localhost ~]# mysqldumpslow - ...
- 数组降维-JavaScript中apply方法妙用
海纳百川,有容乃大 1.普通循环转换方式 将多维数组(尤其是二维数组)转化为一维数组是业务开发中的常用逻辑,除了使用朴素的循环转换以外,我们还可以利用Javascript的语言特性实现更为简洁优雅的转 ...
- GeneXus笔记本—常用函数（下）
这篇是常用函数的最后一节 当然 我这里聊的还不是全部的,需要各位朋友继续在工作中去深入才行啊 ,毕竟从入门到入土....┌(;￣◇￣)┘ 1:Sleep 这个函数你们应该能猜到 ”To allow m ...
- Sass--混合宏 VS 继承 VS 占位符
什么时候用混合宏,什么时候用继承,什么时候使用占位符?”其实他们各有各的优点与缺点,先来看看他们使用效果: a) Sass 中的混合宏使用 总结:编译出来的 CSS 清晰告诉了大家,他不会自动合并相同 ...
- 无法用另一台电脑上的navicat链接主机数据库lost connection toMYSQl server at "handshake":reading inital communication packet,system error:34
同事要用navicat登陆我的数据库,主机地址和密码都没错,但是报错,lost connection toMYSQl server at "handshake":reading i ...
- 【串线篇】Mybatis之SSM整合
SSM:Spring+SpringMVC+MyBatis 建立Java web项目 一.导包 1).Spring: [aop核心] com.springsource.net.sf.cglib-2.2. ...