1.html代码
<script type="text/javascript" src="/Resources_wx/Js/calUtil.js"></script>
<script src="/Resources_wx/Js/jquery-1.8.2.min.js" type="text/javascript" charset="utf-8"></script>
<script src="/Resources_wx/layer_mobile/layer.js" type="text/javascript"></script>
<link href="/Resources_wx/Css/sign.css" rel="stylesheet" />
<link href="/Resources_wx/Css/weui.min.css" rel="stylesheet" type="text/css" />
<body>
<% = _UserID %>
<div class="header_wrap">
<header class="common_header">
<div class="header_left" id="id_GoBack">
<img src="/Resources_wx/Images/Common/back.png" />
<span>返回</span>
</div>
<h2 class="header_title">签到</h2>
<div id="QD" class="header_right" onclick="javascript:AddSign();">立即签到</div>
</header>
</div>
<div style="" id="calendar">
<%-- <div class="sign_main" id="sign_layer">
<div class="sign_succ_calendar_title">
<div class="calendar_month_span">2018年1月</div>
</div>
<div class="sign_equal" id="sign_cal">
<div class="sign_row">
<div class="th_1 bold">日</div>
<div class="th_2 bold">一</div>
<div class="th_3 bold">二</div>
<div class="th_4 bold">三</div>
<div class="th_5 bold">四</div>
<div class="th_6 bold">五</div>
<div class="th_7 bold">六</div>
</div>
<div class="sign_row">
<div class="td_0 calendar_record"></div>
<div class="td_1 calendar_record">1</div>
<div class="td_2 calendar_record">2</div>
<div class="td_3 calendar_record">3</div>
<div class="td_4 calendar_record">4</div>
<div class="td_5 calendar_record">5</div>
<div class="td_6 calendar_record">6</div>
</div>
<div class="sign_row">
<div class="td_0 calendar_record">7</div>
<div class="td_1 calendar_record">8</div>
<div class="td_2 on">9</div>
<div class="td_3 calendar_record">10</div>
<div class="td_4 on">11</div>
<div class="td_5 on">12</div>
<div class="td_6 on">13</div>
</div>
<div class="sign_row">
<div class="td_0 calendar_record">14</div>
<div class="td_1 calendar_record">15</div>
<div class="td_2 calendar_record">16</div>
<div class="td_3 calendar_record">17</div>
<div class="td_4 calendar_record">18</div>
<div class="td_5 calendar_record">19</div>
<div class="td_6 calendar_record">20</div>
</div>
<div class="sign_row">
<div class="td_0 calendar_record">21</div>
<div class="td_1 calendar_record">22</div>
<div class="td_2 calendar_record">23</div>
<div class="td_3 calendar_record">24</div>
<div class="td_4 calendar_record">25</div>
<div class="td_5 calendar_record">26</div>
<div class="td_6 calendar_record">27</div>
</div>
<div class="sign_row">
<div class="td_0 calendar_record">28</div>
<div class="td_1 calendar_record">29</div>
<div class="td_2 calendar_record">30</div>
<div class="td_3 calendar_record">31</div>
<div class="td_4 calendar_record"></div>
<div class="td_5 calendar_record"></div>
<div class="td_6 calendar_record"></div>
</div>
</div>
</div>--%>
</div>
<div id="sign_note" style="text-align: center; position: relative; padding: 15px; font-size: 14px;">
<h2 style="color: red;">签到规则</h2>
<span style="color: red;">本月签到21天即可领取奖品</span>
<br />
<span style="color: red;">本月签到21天即可领取奖品</span>
<br />
<span style="color: red;">本月签到21天即可领取奖品</span>
</div>
<script type="text/javascript">
var UserID = 0;
var signList = [];
$(function () {
//ajax获取日历json数据
//var signList = [{ "signDay": "11" }, { "signDay": "12" }, { "signDay": "13" }, { "signDay": "14" }];
LoadMySign();
LoadSignReward();
});
function LoadMySign(){
var param = { action: "GetSingByUserID", UserID: $("#UserID").val() };
$.ajax({
type: "post",
url: "/ashx/Services_App.ashx",
dataType: "json",
cache: false,
data: param,
success: function (data) {
if (data.Status > 0) {
if (data.Data.ds.length > 0) {
$.each(data.Data.ds, function (i, item) {
/**
标准js格式，其它格式会有浏览器不兼容
new Date("month dd,yyyy hh:mm:ss");
new Date("month dd,yyyy");
new Date(yyyy,mth,dd,hh,mm,ss);
new Date(yyyy,mth,dd);
new Date(ms);
**/
var time = item.SignTime.replace("T", " ");
time = time.replace(/-/g, ':').replace(' ', ':');
time = time.split(':');
var myDate = new Date(time[0], (time[1] - 1), time[2], time[3], time[4], time[5]);
var nowDate = new Date();
if (myDate.getFullYear() == nowDate.getFullYear() && myDate.getMonth() == nowDate.getMonth() && myDate.getDate() == nowDate.getDate()) {
//今日已签到
$("#QD").html("已签到");
$("#QD").removeAttr("onclick");
}
var itemDay = {
signDay: myDate.getDate()
}
console.log(myDate);
signList.push(itemDay);
calUtil.init(signList);
})
}
}
calUtil.init(signList);
}
});
//加载签到规则
function LoadSignReward() {
var param = { action: "LoadSignReward" };
$.ajax({
type: "post",
url: "/ashx/Services_App.ashx",
dataType: "json",
cache: false,
data: param,
success: function (data) {
if (data.Status > 0) {
if (data.Data.ds.length > 0) {
var ResultStr = " <h2 style=\"color: red;\">签到规则</h2>";
$.each(data.Data.ds, function (i, item) {
if (item.RewardID == 1) {//签到七天
if (item.BookID != 0) {
ResultStr += "<span style=\"color: red; \">本月连续签到7天即可领取奖品——图书《" + item.BookName + "》一本</span><br />";
} else if (item.DiscountVoucher != 0) {
ResultStr += "<span style=\"color: red; \">本月连续签到7天即可领取奖品——" + item.DiscountVoucher + "折优惠券一张</span><br />";
} else {
ResultStr += "<span style=\"color: red; \">本月连续签到7天即可领取奖品——" + item.VIPDayNum + "天会员</span><br />";
}
}
if (item.RewardID == 2) {//签到15天
if (item.BookID != 0) {
ResultStr += "<span style=\"color: red; \">本月连续签到15天即可领取奖品——" + item.BookName + "</span><br />";
} else if (item.DiscountVoucher != 0) {
ResultStr += "<span style=\"color: red; \">本月连续签到15天即可领取奖品——" + item.DiscountVoucher + "折优惠券</span><br />";
} else {
ResultStr += "<span style=\"color: red; \">本月连续签到15天即可领取奖品——" + item.VIPDayNum + "天会员</span><br />";
}
}
if (item.RewardID == 3) {//签到30天
if (item.BookID != 0) {
ResultStr += "<span style=\"color: red; \">本月连续签到30天即可领取奖品——" + item.BookName + "</span><br />";
} else if (item.DiscountVoucher != 0) {
ResultStr += "<span style=\"color: red; \">本月连续签到30天即可领取奖品——" + item.DiscountVoucher + "折优惠券</span><br />";
} else {
ResultStr += "<span style=\"color: red; \">本月连续签到30天即可领取奖品——" + item.VIPDayNum + "天会员</span><br />";
}
}
});
$("#sign_note").html(ResultStr);
}
}
}
})
}
//签到
function AddSign() {
var param = { action: "AddSign", UserID: $("#UserID").val() };
$.ajax({
type: "post",
url: "/ashx/Services_App.ashx",
dataType: "json",
cache: false,
data: param,
success: function (data) {
if (data.Status > 0) {
layer.open({
content: data.SuccessStr
, skin: 'msg'
, time: 2 //2秒后自动关闭
, shade: true
});
LoadMySign();
} else if (data.Status == -1) {
layer.open({
content: data.SuccessStr
, skin: 'msg'
, time: 2 //2秒后自动关闭
, shade: true
});
} else {
layer.open({
content: data.SuccessStr
, skin: 'msg'
, time: 2 //2秒后自动关闭
, shade: true
});
}
}
});
}
</script>
</body>
2.网上下载calUtil.js和sign.css文件引入就行了。