/*
* 日期插件
* 滑动选取日期（年，月，日）
* V1.1
*/
(function($) {
$.fn.date = function(options, Ycallback, Ncallback) {
//插件默认选项
var that = $(this);
var docType = $(this).is('input');
var datetime = false;
var nowdate = new Date();
var indexY = 1,
indexM = 1,
indexD = 1;
var indexH = 1,
indexI = 1,
indexS = 0;
var initY = parseInt((nowdate.getYear() + "").substr(1, 2));
var initM = parseInt(nowdate.getMonth() + "") + 1;
var initD = parseInt(nowdate.getDate() + "");
var initH = parseInt(nowdate.getHours());
var initI = parseInt(nowdate.getMinutes());
var initS = parseInt(nowdate.getYear());
var yearScroll = null,
monthScroll = null,
dayScroll = null;
var HourScroll = null,
MinuteScroll = null,
SecondScroll = null;
$.fn.date.defaultOptions = {
beginyear: 2000, //日期--年--份开始
endyear: 2020, //日期--年--份结束
beginmonth: 1, //日期--月--份结束
endmonth: 12, //日期--月--份结束
beginday: 1, //日期--日--份结束
endday: 31, //日期--日--份结束
beginhour: 1,
endhour: 12,
beginminute: 00,
endminute: 59,
curdate: false, //打开日期是否定位到当前日期
theme: "date", //控件样式（1：日期，2：日期+时间）
mode: null, //操作模式（滑动模式）
event: "click", //打开日期插件默认方式为点击后后弹出日期
show: true
}
//用户选项覆盖插件默认选项
var opts = $.extend(true, {}, $.fn.date.defaultOptions, options);
if (opts.theme === "datetime") {
datetime = true;
}
if (!opts.show) {
that.unbind('click');
} else {
//绑定事件（默认事件为获取焦点）
that.bind(opts.event, function() {
createUL(); //动态生成控件显示的日期
init_iScrll(); //初始化iscrll
extendOptions(); //显示控件
that.blur();
if (datetime) {
showdatetime();
refreshTime();
}
refreshDate();
bindButton();
})
};
function refreshDate() {
yearScroll.refresh();
monthScroll.refresh();
dayScroll.refresh();
resetInitDete();
yearScroll.scrollTo(0, initY * 40, 100, true);
monthScroll.scrollTo(0, initM * 40 - 40, 100, true);
dayScroll.scrollTo(0, initD * 40 - 40, 100, true);
}
function refreshTime() {
HourScroll.refresh();
MinuteScroll.refresh();
SecondScroll.refresh();
if (initH > 12) { //判断当前时间是上午还是下午
SecondScroll.scrollTo(0, initD * 40 - 40, 100, true); //显示“下午”
initH = initH - 12 - 1;
}
HourScroll.scrollTo(0, initH * 40, 100, true);
MinuteScroll.scrollTo(0, initI * 40, 100, true);
initH = parseInt(nowdate.getHours());
}
function resetIndex() {
indexY = 1;
indexM = 1;
indexD = 1;
}
function resetInitDete() {
if (opts.curdate) {
return false;
} else if (that.val() === "") {
return false;
}
initY = parseInt(that.val().substr(2, 2));
initM = parseInt(that.val().substr(5, 2));
initD = parseInt(that.val().substr(8, 2));
}
function bindButton() {
resetIndex();
$("#dateconfirm").unbind('click').click(function() {
var datestr = $("#yearwrapper ul li:eq(" + indexY + ")").html().substr(0, $("#yearwrapper ul li:eq(" + indexY + ")").html().length - 1) + "-" +
$("#monthwrapper ul li:eq(" + indexM + ")").html().substr(0, $("#monthwrapper ul li:eq(" + indexM + ")").html().length - 1) + "-" +
$("#daywrapper ul li:eq(" + Math.round(indexD) + ")").html().substr(0, $("#daywrapper ul li:eq(" + Math.round(indexD) + ")").html().length - 1);
if (datetime) {
if (Math.round(indexS) === 1) { //下午
$("#Hourwrapper ul li:eq(" + indexH + ")").html(parseInt($("#Hourwrapper ul li:eq(" + indexH + ")").html().substr(0, $("#Hourwrapper ul li:eq(" + indexH + ")").html().length - 1)) + 12)
} else {
$("#Hourwrapper ul li:eq(" + indexH + ")").html(parseInt($("#Hourwrapper ul li:eq(" + indexH + ")").html().substr(0, $("#Hourwrapper ul li:eq(" + indexH + ")").html().length - 1)))
}
datestr += " " + $("#Hourwrapper ul li:eq(" + indexH + ")").html().substr(0, $("#Minutewrapper ul li:eq(" + indexH + ")").html().length - 1) + ":" +
$("#Minutewrapper ul li:eq(" + indexI + ")").html().substr(0, $("#Minutewrapper ul li:eq(" + indexI + ")").html().length - 1);
indexS = 0;
}
if (Ycallback === undefined) {
if (docType) {
that.val(datestr);
} else {
that.html(datestr);
}
} else {
Ycallback(datestr);
}
$("#datePage").hide();
$("#dateshadow").hide();
});
$("#datecancle").click(function() {
$("#datePage").hide();
$("#dateshadow").hide();
Ncallback(false);
});
}
function extendOptions() {
$("#datePage").show();
$("#dateshadow").show();
}
//日期滑动
function init_iScrll() {
var strY = $("#yearwrapper ul li:eq(" + indexY + ")").html().substr(0, $("#yearwrapper ul li:eq(" + indexY + ")").html().length - 1);
var strM = $("#monthwrapper ul li:eq(" + indexM + ")").html().substr(0, $("#monthwrapper ul li:eq(" + indexM + ")").html().length - 1)
yearScroll = new iScroll("yearwrapper", {
snap: "li",
vScrollbar: false,
onScrollEnd: function() {
indexY = (this.y / 40) * (-1) + 1;
opts.endday = checkdays(strY, strM);
$("#daywrapper ul").html(createDAY_UL());
dayScroll.refresh();
}
});
monthScroll = new iScroll("monthwrapper", {
snap: "li",
vScrollbar: false,
onScrollEnd: function() {
indexM = (this.y / 40) * (-1) + 1;
opts.endday = checkdays(strY, strM);
$("#daywrapper ul").html(createDAY_UL());
dayScroll.refresh();
}
});
dayScroll = new iScroll("daywrapper", {
snap: "li",
vScrollbar: false,
onScrollEnd: function() {
indexD = (this.y / 40) * (-1) + 1;
}
});
}
function showdatetime() {
init_iScroll_datetime();
addTimeStyle();
$("#datescroll_datetime").show();
$("#Hourwrapper ul").html(createHOURS_UL());
$("#Minutewrapper ul").html(createMINUTE_UL());
$("#Secondwrapper ul").html(createSECOND_UL());
}
//日期+时间滑动
function init_iScroll_datetime() {
HourScroll = new iScroll("Hourwrapper", {
snap: "li",
vScrollbar: false,
onScrollEnd: function() {
indexH = Math.round((this.y / 40) * (-1)) + 1;
HourScroll.refresh();
}
})
MinuteScroll = new iScroll("Minutewrapper", {
snap: "li",
vScrollbar: false,
onScrollEnd: function() {
indexI = Math.round((this.y / 40) * (-1)) + 1;
HourScroll.refresh();
}
})
SecondScroll = new iScroll("Secondwrapper", {
snap: "li",
vScrollbar: false,
onScrollEnd: function() {
indexS = Math.round((this.y / 40) * (-1));
HourScroll.refresh();
}
})
}
function checkdays(year, month) {
var new_year = year; //取当前的年份
var new_month = month++; //取下一个月的第一天，方便计算（最后一天不固定）
if (month > 12) //如果当前大于12月，则年份转到下一年
{
new_month -= 12; //月份减
new_year++; //年份增
}
var new_date = new Date(new_year, new_month, 1); //取当年当月中的第一天
return (new Date(new_date.getTime() - 1000 * 60 * 60 * 24)).getDate(); //获取当月最后一天日期
}
function createUL() {
CreateDateUI();
$("#yearwrapper ul").html(createYEAR_UL());
$("#monthwrapper ul").html(createMONTH_UL());
$("#daywrapper ul").html(createDAY_UL());
}
function CreateDateUI() {
var str = '' +
'<div id="dateshadow"></div>' +
'<div id="datePage" class="page">' +
'<section>' +
'<div id="datetitle"><h1>请选择日期</h1></div>' +
'<div id="datemark"><a id="markyear"></a><a id="markmonth"></a><a id="markday"></a></div>' +
'<div id="timemark"><a id="markhour"></a><a id="markminut"></a><a id="marksecond"></a></div>' +
'<div id="datescroll">' +
'<div id="yearwrapper">' +
'<ul></ul>' +
'</div>' +
'<div id="monthwrapper">' +
'<ul></ul>' +
'</div>' +
'<div id="daywrapper">' +
'<ul></ul>' +
'</div>' +
'</div>' +
'<div id="datescroll_datetime">' +
'<div id="Hourwrapper">' +
'<ul></ul>' +
'</div>' +
'<div id="Minutewrapper">' +
'<ul></ul>' +
'</div>' +
'<div id="Secondwrapper">' +
'<ul></ul>' +
'</div>' +
'</div>' +
'</section>' +
'<footer id="dateFooter">' +
'<div id="setcancle">' +
'<ul>' +
'<li id="dateconfirm">确定</li>' +
'<li id="datecancle">取消</li>' +
'</ul>' +
'</div>' +
'</footer>' +
'</div>'
$("#datePlugin").html(str);
}
function addTimeStyle() {
$("#datePage").css("height", "380px");
$("#datePage").css("top", "60px");
$("#yearwrapper").css("position", "absolute");
$("#yearwrapper").css("bottom", "200px");
$("#monthwrapper").css("position", "absolute");
$("#monthwrapper").css("bottom", "200px");
$("#daywrapper").css("position", "absolute");
$("#daywrapper").css("bottom", "200px");
}
//创建 --年-- 列表
function createYEAR_UL() {
var str = "<li> </li>";
for (var i = opts.beginyear; i <= opts.endyear; i++) {
str += '<li>' + i + '年</li>'
}
return str + "<li> </li>";;
}
//创建 --月-- 列表
function createMONTH_UL() {
var str = "<li> </li>";
for (var i = opts.beginmonth; i <= opts.endmonth; i++) {
if (i < 10) {
i = "0" + i
}
str += '<li>' + i + '月</li>'
}
return str + "<li> </li>";;
}
//创建 --日-- 列表
function createDAY_UL() {
$("#daywrapper ul").html("");
var str = "<li> </li>";
for (var i = opts.beginday; i <= opts.endday; i++) {
str += '<li>' + i + '日</li>'
}
return str + "<li> </li>";;
}
//创建 --时-- 列表
function createHOURS_UL() {
var str = "<li> </li>";
for (var i = opts.beginhour; i <= opts.endhour; i++) {
str += '<li>' + i + '时</li>'
}
return str + "<li> </li>";;
}
//创建 --分-- 列表
function createMINUTE_UL() {
var str = "<li> </li>";
for (var i = opts.beginminute; i <= opts.endminute; i++) {
if (i < 10) {
i = "0" + i
}
str += '<li>' + i + '分</li>'
}
return str + "<li> </li>";;
}
//创建 --分-- 列表
function createSECOND_UL() {
var str = "<li> </li>";
str += "<li>上午</li><li>下午</li>"
return str + "<li> </li>";;
}
}
})(jQuery);
console