jquery移动端实现阶段日历（非整年整月，只一个周期）

jquery移动端实现阶段日历（非整年整月，只一个周期）

如有更好的解决方案，欢迎留言讨论切磋~

HTML

<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="time clearfix">
<div class="time_td "><span>周五</span>
<p>09-02</p>
</div>
<div class="time_td"><span>周六</span>
<p>09-03</p>
</div>
<div class="time_td"><span>周日</span>
<p>09-04</p>
</div>
<div class="time_td choice_no"><span>周一</span>
<p>09-05</p>
</div>
<div class="time_td"><span>周二</span>
<p>09-06</p>
</div>
<div class="time_td"><span>周三</span>
<p>09-07</p>
</div>
<div class="time_td"><span>周四</span>
<p>09-08</p>
</div>
<div class="time_td"><span>周五</span>
<p>09-09</p>
</div>
<div class="time_td"><span>周六</span>
<p>09-10</p>
</div>
<div class="time_td"><span>周日</span>
<p>09-11</p>
</div>
</div>
</div>
<div class="swiper-slide">

<div class="time clearfix">
<div class="time_td"><span>周一</span>
<p>09-12</p>
</div>
<div class="time_td"><span>周六</span>
<p>09-13</p>
</div>
<div class="time_td"><span>周日</span>
<p>09-14</p>
</div>
<div class="time_td"><span>周一</span>
<p>09-15</p>
</div>
<div class="time_td"><span>周二</span>
<p>09-16</p>
</div>
<div class="time_td"><span>周三</span>
<p>09-17</p>
</div>
<div class="time_td"><span>周四</span>
<p>09-18</p>
</div>
<div class="time_td"><span>周五</span>
<p>09-19</p>
</div>
<div class="time_td"><span>周六</span>
<p>09-20</p>
</div>
<div class="time_td"><span>周日</span>
<p>09-21</p>
</div>
</div>
</div>
</div>
</div>

js

/********************时间页面切换********************/
//==================右
$("#yuejia").click(function() {
$(this).addClass("opacity");
$("#yuejian").removeClass("opacity");
$(".swiper-slide:first").animate({
left: "-100%"
});
$(".swiper-slide:last").animate({
right: "99%"
})
});
//==================左
$("#yuejian").click(function() {
$(this).addClass("opacity");
$("#yuejia").removeClass("opacity");
$(".swiper-slide:first").animate({
left: "0%"
});
$(".swiper-slide:last").animate({
right: "0%"
})
});
/********************时间选择********************/
$(".time_td").click(function() {

if($(this).hasClass("choice_no")) {
$(this).removeClass("choice_yes");
} else {
$(this).addClass("choice_yes").siblings().removeClass("choice_yes");
$(this).addClass("choice_yes").parents().siblings().find(".time_td").removeClass("choice_yes");
}
});
/********************弹框选择********************/
$(".choice_time li .choice").click(function() {
$(this).addClass("choice_yes").siblings().removeClass("choice_yes");
});
$(".im_tab p").click(function() {
$(this).addClass("active").siblings().removeClass("active");
$(".date").eq($(this).index()).show().siblings(".date").hide();
$(".tab").eq($(this).index()).addClass("active").siblings().removeClass("active");
});
/********************日期********************/
/********************************************/
var day = new Date()
var weekday = new Array(7)
weekday = ["周日", "周一", "周二", "周三", "周四", "周五", "周六", ]
var week = day.getDay(); //获取当前星期
var year = day.getFullYear(); //年
var mon = day.getMonth() + 1; //获取当前月份
var days = day.getDate(); //获取当前日数
var leap_year = year % 4 //判断是否为闰年
var time_s = $(".time_td span");
var l_today = $("#l_today");
var time_p = $(".time_td p");
/********************日历周几赋值********************/
for(var i = 0; i < 20; i++) { //20天一循环
var week2 = 0;
week2 = (week + i) % 7;// 求余
time_s.eq(i).html(weekday[week2]);
}
/********************日历日期表赋值********************/
for(var j = 0; j < 20; j++) {
days_f = parseFloat(days) + j;
if(mon == 2 && leap_year == 0) { //闰年闰月
//alert("润二月")
if(days_f > 29) {
days_f = parseFloat(days_f) - 29;
mon2 = parseFloat(mon) + 1;
time_p.eq(j).html(mon2 + "-" + days_f);
} else {
time_p.eq(j).html(mon + "-" + days_f);
}
} else if(mon == 2 && leap_year != 0) {
//alert("平二月")
if(days_f > 28) {
days_f = parseFloat(days_f) - 28;
mon2 = parseFloat(mon) + 1;
time_p.eq(j).html(mon2 + "-" + days_f);
} else {
time_p.eq(j).html(mon + "-" + days_f);
}
} else if(mon == 4 || mon == 6 || mon == 9 || mon == 11) {
//alert("30天")
if(days_f > 30) {
days_f = parseFloat(days_f) - 30;
mon2 = parseFloat(mon) + 1;
time_p.eq(j).html(mon2 + "-" + days_f);
} else {
time_p.eq(j).html(mon + "-" + days_f);
}
} else {
//alert("正常")
if(days_f > 31) {
days_f = parseFloat(days_f) - 31;
mon2 = parseFloat(mon) + 1;
time_p.eq(j).html(mon2 + "-" + days_f);
} else {
time_p.eq(j).html(mon + "-" + days_f);
}
}
}
/********************标题日期********************/
$("#today").html(mon + "-" + days);
if(mon == 4 || mon == 6 || mon == 9 || mon == 11) { //判断当月天数为30天
if(days <= 11) {
days = parseFloat(days) + 19;
l_today.html(mon + "-" + days);
} else {
days = parseFloat(days) + 19 - 30;
if(mon == 12) {
mon = 1

l_today.html(mon + "-" + days);
} else {
mon = parseFloat(mon) + 1;
l_today.html(mon + "-" + days);
}
}
} else if(mon == 2) { //判断二月份是否闰年
if(leap_year == 0) {
if(days <= 10) {
days = parseFloat(days) + 19;
l_today.html(mon + "-" + days);
} else {
days = parseFloat(days) + 19 - 29;
mon = parseFloat(mon) + 1;
l_today.html(mon + "-" + days);
}
} else {
if(days <= 9) {
days = parseFloat(days) + 19;
l_today.html(mon + "-" + days);
} else {
days = parseFloat(days) + 19 - 28;
mon = parseFloat(mon) + 1;
l_today.html(mon + "-" + days);
}
}
} else { //31天的月份
if(days <= 12) {
days = parseFloat(days) + 19;
l_today.html(mon + "-" + days);
} else {
days = parseFloat(days) + 19 - 31;
if(mon == 12) {
mon = 1
l_today.html(mon + "-" + days);
} else {
mon = parseFloat(mon) + 1;
l_today.html(mon + "-" + days);
}

}
}