Created
August 16, 2014 13:18
-
-
Save backsapce/af3f6b7dec3a74531414 to your computer and use it in GitHub Desktop.
js copy
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//日历JS部分 | |
var da=new Date(); | |
var index_calendar_year=da.getFullYear(); | |
var index_calendar_month=da.getMonth() + 1 ;//当前月份 | |
var index_calendar_date=da.getDate();//当前日期,0为全部 | |
var m_old = index_calendar_month; | |
var y_old = index_calendar_year; | |
function DaysInMonth(iYear,iMonth) | |
{ | |
var dDate = new Date(iYear, iMonth, 0); | |
return dDate.getDate(); | |
} | |
//var index_calendar_date_arr=new Array(list_count); | |
function calendarShowMonth(m_ing,y_ing,news){ | |
var d=da; | |
iy=Math.abs((y_ing-y_old)*12)+(m_ing-m_old); | |
// alert(m_old); | |
i=m_old; | |
if(iy<0) | |
{ | |
m_old=i=m_ing; | |
if(i==1) | |
{ | |
m_old=i=12; | |
y_old--; | |
y_ing-- | |
} | |
news=true; | |
} | |
else | |
{ | |
ie=iy-7; | |
//alert(iy); | |
//alert(ie); | |
if(ie>=0) | |
{ | |
m_old=i=i+ie+1; | |
if(i>12) | |
{ | |
m_old=i=1; | |
y_old++; | |
} | |
news=true; | |
} | |
} | |
//if(m_ing) | |
if(news){ | |
count=i+7; | |
mmi=i; | |
var dateHtml="<table width=\"860\" cellpadding=\"0\" cellspacing=\"0\"><tr><td class=\"arrow\"><div class=\"arrow-wrap\"><a href=\"javascript:calendarGo(-1);\" class=\"l\">←</a></div></td>"; | |
for( i ;i<count;i++) | |
{ | |
dateHtml=dateHtml+'<td width=\"98\" class=\"month\"><a href=\"javascript:calendarMonth('+mmi+','+y_ing+');\" id=\"calendar_month_'+mmi+'\">'+y_ing+'年'+mmi+'月</a></td>'; | |
mmi++; | |
if(mmi>12) | |
{ | |
mmi=1; | |
y_ing++; | |
} | |
} | |
dateHtml=dateHtml+'<td class=\"arrow\"><div class=\"arrow-wrap\"><a href=\"javascript:calendarGo(1);\" class=\"r\">→</a></div></td></tr> </table>'; | |
// alert(dateHtml); | |
$(".month-table p").html(dateHtml); | |
} | |
} | |
//选择月份 | |
function calendarMonth(m,y){ | |
index_calendar_year=y; | |
index_calendar_month=m; | |
index_calendar_date=0;//日期设为0 | |
$(".month a").removeClass("on"); | |
$("#calendar_month_"+m).addClass("on"); | |
calendarShowDate(y,m); | |
calendarLoading(); | |
calendarGetEvents(); | |
} | |
//alert(DaysInMonth(index_calendar_year,index_calendar_month)); | |
//选择日子 | |
function calendarDate(d,aObj){ | |
index_calendar_date=d; | |
$(".date-div a").removeClass("on"); | |
$("#cd_"+d).addClass("on"); | |
calendarLoading(); | |
calendarGetEvents(); | |
} | |
//显示Loading提示 | |
function calendarLoading(){ | |
$(".loading-div").show(); | |
$(".event-div").html(''); | |
$(".event-div").hide(); | |
} | |
//列出月份 | |
//列出日子 | |
function calendarShowDate(y,m){ | |
var dateHtml=""; | |
// | |
month=DaysInMonth(y,m); | |
for(var i=1;i<month;i++){ | |
dateHtml=dateHtml+'<a href="javascript:calendarDate('+i+')" id="cd_'+i+'">'+i+'</a> / '; | |
} | |
dateHtml=dateHtml+'<a href="javascript:calendarDate('+i+')" id="cd_'+i+'">'+i+'</a>';//最后一天,没有斜杠 | |
$(".date-div p").html(dateHtml); | |
} | |
//上一月下一月 | |
function calendarGo(mm){ | |
console.log('move + ' + mm) | |
var newMonth; | |
var new_year; | |
if(mm==1&&index_calendar_month==12){ | |
newMonth=index_calendar_month=1; | |
new_year=index_calendar_year=index_calendar_year+mm | |
}else if(mm==-1&&index_calendar_month==1){ | |
newMonth=index_calendar_month=12; | |
new_year=index_calendar_year=index_calendar_year+mm | |
}else{ | |
newMonth=index_calendar_month+mm; | |
new_year=index_calendar_year; | |
} | |
calendarShowMonth(newMonth,new_year,false); | |
// alert(new_year); | |
// if(index_calendar_date_arr[newMonth]!=null){ | |
calendarMonth(newMonth,new_year); | |
// } | |
} | |
//读取活动数据 | |
function calendarGetEvents(){ | |
var eventHtml=""; | |
$.ajax({ | |
url: 'http://www.veryevent.com:8001/calendars/'+index_calendar_month+'/'+index_calendar_date+'/'+index_calendar_year, | |
success: function (data) { | |
var result = eval('('+data+')'); | |
$(".loading-div").hide(); | |
$(".event-div").show(); | |
$.each(result, function(_i, _json){ | |
eventHtml=eventHtml+'<div class="event"><h5><a title="'+_json[0]+'" href="'+_json[4]+'">'+_json[0]+'</a></h5><div class="info">'+_json[1]+' '+_json[2]+' '+_json[3]+'</div></div>'; | |
}); | |
$(".event-div").html(eventHtml); | |
}, | |
cache: true | |
}); | |
} | |
$(document).ready(function(){ | |
//页面加载完成就读取默认月份的数据 | |
calendarShowMonth(index_calendar_month,index_calendar_year,true); | |
calendarShowDate(index_calendar_year,index_calendar_month) | |
//calendarMonth(index_calendar_month); | |
//calendarDate(index_calendar_date); | |
$(".month a").removeClass("on"); | |
$("#calendar_month_"+index_calendar_month).addClass("on"); | |
$(".date-div a").removeClass("on"); | |
$("#cd_"+index_calendar_date).addClass("on"); | |
calendarLoading(); | |
calendarGetEvents(); | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<style> | |
#unit{ | |
float:left; | |
background:red; | |
width:100px; | |
height:100px; | |
margin-left :10px | |
} | |
#pre,#next{ | |
float:left; | |
background:blue; | |
width:50px; | |
height:100px; | |
margin-left :10px | |
} | |
</style> | |
<script src='http://www.veryevent.com:8001/js/jquery.min.js'></script> | |
<script src='cal.js'></script> | |
</head> | |
<body> | |
<div class="calendar"> | |
<div class="calendar-title"> | |
活动日历 | |
</div> | |
<div class="calendar-body"> | |
<div class="month-table"><p><table width="860" cellpadding="0" cellspacing="0"><tbody><tr><td class="arrow"><div class="arrow-wrap"><a href="javascript:calendarGo(-1);" class="l">←</a></div></td><td width="98" class="month"><a href="javascript:calendarMonth(8,2014);" id="calendar_month_8" class="on">2014年8月</a></td><td width="98" class="month"><a href="javascript:calendarMonth(9,2014);" id="calendar_month_9">2014年9月</a></td><td width="98" class="month"><a href="javascript:calendarMonth(10,2014);" id="calendar_month_10">2014年10月</a></td><td width="98" class="month"><a href="javascript:calendarMonth(11,2014);" id="calendar_month_11">2014年11月</a></td><td width="98" class="month"><a href="javascript:calendarMonth(12,2014);" id="calendar_month_12">2014年12月</a></td><td width="98" class="month"><a href="javascript:calendarMonth(1,2015);" id="calendar_month_1">2015年1月</a></td><td width="98" class="month"><a href="javascript:calendarMonth(2,2015);" id="calendar_month_2">2015年2月</a></td><td class="arrow"><div class="arrow-wrap"><a href="javascript:calendarGo(1);" class="r">→</a></div></td></tr> </tbody></table></p> | |
</div> | |
<div class="date-div"> | |
<h5>选择日期</h5> | |
<p><a href="javascript:calendarDate(1)" id="cd_1" class="on">1</a> / <a href="javascript:calendarDate(2)" id="cd_2">2</a> / <a href="javascript:calendarDate(3)" id="cd_3">3</a> / <a href="javascript:calendarDate(4)" id="cd_4">4</a> / <a href="javascript:calendarDate(5)" id="cd_5">5</a> / <a href="javascript:calendarDate(6)" id="cd_6">6</a> / <a href="javascript:calendarDate(7)" id="cd_7">7</a> / <a href="javascript:calendarDate(8)" id="cd_8">8</a> / <a href="javascript:calendarDate(9)" id="cd_9">9</a> / <a href="javascript:calendarDate(10)" id="cd_10">10</a> / <a href="javascript:calendarDate(11)" id="cd_11">11</a> / <a href="javascript:calendarDate(12)" id="cd_12">12</a> / <a href="javascript:calendarDate(13)" id="cd_13">13</a> / <a href="javascript:calendarDate(14)" id="cd_14">14</a> / <a href="javascript:calendarDate(15)" id="cd_15">15</a> / <a href="javascript:calendarDate(16)" id="cd_16" class="">16</a> / <a href="javascript:calendarDate(17)" id="cd_17">17</a> / <a href="javascript:calendarDate(18)" id="cd_18">18</a> / <a href="javascript:calendarDate(19)" id="cd_19">19</a> / <a href="javascript:calendarDate(20)" id="cd_20">20</a> / <a href="javascript:calendarDate(21)" id="cd_21">21</a> / <a href="javascript:calendarDate(22)" id="cd_22">22</a> / <a href="javascript:calendarDate(23)" id="cd_23">23</a> / <a href="javascript:calendarDate(24)" id="cd_24">24</a> / <a href="javascript:calendarDate(25)" id="cd_25">25</a> / <a href="javascript:calendarDate(26)" id="cd_26">26</a> / <a href="javascript:calendarDate(27)" id="cd_27">27</a> / <a href="javascript:calendarDate(28)" id="cd_28">28</a> / <a href="javascript:calendarDate(29)" id="cd_29">29</a> / <a href="javascript:calendarDate(30)" id="cd_30">30</a> / <a href="javascript:calendarDate(31)" id="cd_31">31</a></p> | |
</div> | |
<div class="loading-div" style="display: block;"> | |
载入中,请稍后... | |
</div> | |
<div class="event-div" style="display: none;"></div> | |
<!--event-div--> | |
</div> | |
</div> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment