/**
*
* @example:
如下调用：
xvDate({
'targetId':'date1',//时间写入对象的id
'triggerId':['date1','dateBtn1'],//触发事件的对象id
'alignId':'datesWrap1',//日历对齐对象
'format':'-',//时间格式 默认'YYYY-MM-DD HH:MM:SS'
'min':'2014-09-20 10:00:00',//最大时间
'max':'2014-10-30 10:00:00'//最小时间
});
参数说明：
targetId ：日期写入对象的id，不能为空
triggerId ：触发事件的对象id，如果不设置则默认为targetId
alignId ： 日历盒子的对齐基准，如果不设置则默认为targetId
hms ： 时分秒是否开启，默认值为'on'则表示开启时分秒(2014-09-20 10:00:00),'off'则表示关闭时分秒模式(2014-09-20)
format ：为日期格式 默认值为'-' (2014-09-20),'/'则表示(2014/09/20)
min ：最小时间限制，min 的时间格式和前面的时间格式保持一直
max ：最大时间限制，max 的时间格式和前面的时间格式保持一直
zIndex ：最大时间限制，日历盒子的层级，默认9999
如果需要使用模块化在需要依赖的模块用引入即可
如：define('mod1',[],function(require, exports, module){
var xvDate = require("xvDate");
})
*/
/**
* Dates
* author : xv
* description : '日期控件'
* date : 2014-9-20
* version : 1.0
*/
;
(function (factory) {
if (typeof define === 'function') {
define('xvDate', [], function (require, exports, module) {
var xvDate = {};
factory(xvDate);
module.exports = xvDate.xvDate;
})
} else {
factory(window);
}
})(function (win) {
var Calendar = {};
win.xvDate = function (opts) {
var triggerId = opts.triggerId || opts.targetId;
if (typeof triggerId === 'object' && triggerId.length) {
var triggerEls = [];
for (var i = 0; i < triggerId.length; i++) {
triggerEls.push(Calendar.getId(triggerId[i]));
Calendar.enable(triggerEls[i], triggerEls, opts);
}
} else {
triggerEls = Calendar.getId(triggerId);
Calendar.enable(triggerEls, triggerEls, opts);
}
};
Calendar.fn = Calendar.prototype = {
init: function (opts) {
var isToday = false;
this.creatView(opts);
this.initTimes(isToday);
},
gb: {},
creatView: function (settings) {
var opts = settings || {},
_this = this,
iptDatesId = opts.targetId || 'dates',
iptDates = Calendar.getId(iptDatesId),
docOpts;
_this.gb.algin = opts.alignId ? Calendar.getId(opts.alignId) : iptDates;
_this.gb.format = opts.format || '-';
_this.gb.hms = (opts.hms === 'off' ? null : true);
_this.gb.zIndex = opts.zIndex || 9999;
_this.gb.trigger = opts.trigger;
_this.limitTime(opts.min, 'minTime');
_this.limitTime(opts.max, 'maxTime');
if (!_this.gb.datesBox) {
var datesBox = _this.gb.datesBox = _this.creatEle("div");
_this.gb.datesBox.id = 'xv_Dates_box';
_this.gb.target = iptDates;
_this.gb.datesBox.className = 'dates_box';
_this.gb.datesBox.style.display = 'block';
_this.gb.datesBox.style.zIndex = _this.gb.zIndex;
_this.append(_this.gb.datesBox);
datesBox.innerHTML = "<div class='dates_box_top'>" +
"<div class='dates_yy dates_choose'>" +
"<span class='prev_choose choose_btn' id='xv_Yy_prev'><i class='sign'></i></span>" +
"<span class='ipt_wrap' id='xv_Year_wrap'><input class='dlt_status' style='width:32px;margin-left:4px;' id='xv_Ipt_year' type='text'><small>年</small><i class='sign'></i></span>" +
"<span class='next_choose choose_btn' id='xv_Yy_next'><i class='sign'></i></span>" +
"<div class='dates_yy_list' id='xv_Dates_yy_list' style='display:none'>" +
function () {
var str = '';
for (var i = 1970; i < 2100; i++) {
str += '<span dateValue = ' + i + '>' + i + '</span>';
}
return str;
}() +
"</div>" +
"</div>" +
"<div class='dates_mm dates_choose'>" +
"<span class='prev_choose choose_btn' id='xv_Mm_prev'><i class='sign'></i></span>" +
"<span class='ipt_wrap' id='xv_Moth_wrap'><input class='dlt_status' style='width:16px;margin-left:10px;' id='xv_Ipt_month' type='text'><small>月</small><i class='sign'></i></span>" +
"<span class='next_choose choose_btn' id='xv_Mm_next'><i class='sign'></i></span>" +
"<div class='dates_mm_list' id='xv_Dates_mm_list' style='display:none'>" +
function () {
var str = '';
for (var i = 1; i < 13; i++) {
if (i < 10) {
str += '<span dateValue =' + i + '>0' + i + '月</span>';
} else {
str += '<span dateValue =' + i + '>' + i + '月</span>';
}
}
return str;
}() +
"</div>" +
"</div>" +
"</div>" +
this.viewTb() +
"<div class='dates_bottom'>" +
"<ul id='dates_hms' class='dates_hms' style='display:block' >" +
"<li class='time_tag'>时间</li>" +
"<li><input type='text' id='xv_Hours' class='dlt_status'><span>:</span></li>" +
"<li><input type='text' id='xv_Minutes' class='dlt_status'><span>:</span></li>" +
"<li><input type='text' id='xv_Seconds' class='dlt_status'><span> </span></li>" +
"</ul>" +
"<div class='dates_btn'>" +
"<a id='xv_Dates_clear'>清空</a>" +
"<a id='xv_Dates_today'>今天</a>" +
"<a id='xv_Dates_ok'>确认</a>" +
"</div>" +
"</div>";
_this.handleTime();
_this.gb.datesHms = Calendar.getId('dates_hms');
_this.setPosition(_this.gb.algin, _this.gb.datesBox, {left: 0, top: 0});
_this.setPosition(_this.gb.algin, _this.gb.datesBox);
docOpts = {that: _this};
Calendar.addEvent(document, 'click', _this.docArea, docOpts);
} else {
if (_this.gb.target !== iptDates && !_this.ishd(_this.gb.datesBox)) {
Calendar.removeEvent(document, 'click', _this.docArea);
_this.shde(_this.gb.datesBox, 2);
} else {
_this.shde(_this.gb.datesBox);
}
_this.gb.target = iptDates;
_this.setPosition(_this.gb.algin, _this.gb.datesBox, {left: 0, top: 0});
_this.setPosition(_this.gb.algin, _this.gb.datesBox);
docOpts = {that: _this};
Calendar.removeEvent(document, 'click', _this.docArea);
Calendar.addEvent(document, 'click', _this.docArea, docOpts);
_this.gb.datesBox.style.zIndex = _this.gb.zIndex;
}
var datesHms = this.gb.datesHms;
if (!datesHms) {
this.shde(datesHms, 1);
} else {
this.shde(datesHms, 2);
}
var triggerId = opts.triggerId || opts.targetId;
if (typeof triggerId === 'object' && triggerId.length) {
_this.gb.trigger = [];
for (var i = 0; i < triggerId.length; i++) {
_this.gb.trigger.push(Calendar.getId(triggerId[i]));
}
} else {
_this.gb.trigger = Calendar.getId(triggerId);
}
},
docArea: function (e) {
var cuElt = e.srcElement || e.target;
var that = e.datas.that;
var cond = !that.ishd(that.gb.datesBox) && !that.contain(that.gb.datesBox, cuElt) && cuElt !== that.gb.target && !that.isExistObj(that.gb.trigger, cuElt);
if (cond) {
that.shde(that.gb.datesBox, 1);
}
},
limitTime: function (time, timeType) {
var times = this.checkTime(time);
if (times) {
this.gb[timeType] = this.datesSplit(times);
} else {
this.gb[timeType] = null;
}
},
datesSplit: function (time) {
if (time) {
datesTimeArr = time.split(' '),
datesArr = datesTimeArr[0].split(/[-\/]/),
timesArr = (this.gb.hms && datesTimeArr[1]) ? datesTimeArr[1].split(':') : null;
return {
'year': datesArr[0],
'month': datesArr[1],
'date': datesArr[2],
'hours': timesArr ? timesArr[0] : 0,
'minutes': timesArr ? timesArr[1] : 0,
'seconds': timesArr ? timesArr[2] : 0
};
} else {
return time;
}
},
handleTime: function () {
var _this = this;
_this.gb.td = Calendar.getId("dates_table").getElementsByTagName("td");
var els = _this.gb.els = {
'yearWrap': Calendar.getId("xv_Year_wrap"),
'monthWrap': Calendar.getId("xv_Moth_wrap"),
'yyList': Calendar.getId("xv_Dates_yy_list"),
'mmList': Calendar.getId("xv_Dates_mm_list"),
'yyConList': Calendar.getId("xv_Dates_yy_list").getElementsByTagName("span"),
'mmConList': Calendar.getId("xv_Dates_mm_list").getElementsByTagName("span"),
'yyPrev': Calendar.getId("xv_Yy_prev"),
'yyNext': Calendar.getId("xv_Yy_next"),
'mmPrev': Calendar.getId("xv_Mm_prev"),
'mmNext': Calendar.getId("xv_Mm_next"),
'datesClear': Calendar.getId("xv_Dates_clear"),
'datesToday': Calendar.getId("xv_Dates_today"),
'datesOk': Calendar.getId("xv_Dates_ok"),
'iptYear': Calendar.getId("xv_Ipt_year"),
'iptMonth': Calendar.getId("xv_Ipt_month"),
'iptHours': Calendar.getId("xv_Hours"),
'iptMinutes': Calendar.getId("xv_Minutes"),
'iptSeconds': Calendar.getId("xv_Seconds")
};
//时分秒的编辑操作处理
var timesArr = [els.iptYear, els.iptMonth, els.iptHours, els.iptMinutes, els.iptSeconds];
for (var i = 0; i < timesArr.length; i++) {//时分秒获取焦点的操作
Calendar.addEvent(timesArr[i], 'click', _this.focusStatus);
}
Calendar.addEvent(els.iptYear, 'blur', function () {//年自定义编辑输入处理
var str = '^((19[0-9]{2})|(2[0-9]{3}))$',
that = this,
year = _this.checkFocus(str, that, _this.gb.time.year);
if (year) {
_this.gb.time.year = year;
_this.insertDate();
}
});
Calendar.addEvent(els.iptMonth, 'blur', function () {//月自定义编辑输入处理
var str = '^((0[1-9])|(1[0-2])|[1-9])$',
that = this,
month = _this.checkFocus(str, that, _this.formatTime(_this.gb.time.month));
if (month) {
_this.gb.time.month = month;
_this.insertDate();
}
});
Calendar.addEvent(els.iptHours, 'blur', function () {//小时自定义编辑输入处理
var str = '^(([0-1][0-9])|(2[0-3])|[0-9])$';
var that = this;
_this.gb.time.hours = _this.checkFocus(str, that, '00');
});
Calendar.addEvent(els.iptMinutes, 'blur', function () {//分钟自定义编辑输入处理
var str = '^(([0-5][0-9])|[0-9])$';
var that = this;
_this.gb.time.minutes = _this.checkFocus(str, that, '00');
});
Calendar.addEvent(els.iptSeconds, 'blur', function () {//秒自定义编辑输入处理
var str = '^(([0-5][0-9])|[0-9])$';
var that = this;
_this.gb.time.seconds = _this.checkFocus(str, that, '00');
});
//时间面板的控制按钮
Calendar.addEvent(els.datesClear, 'click', function () {//清空当前时间
_this.gb.target.value = '';
});
Calendar.addEvent(els.datesOk, 'click', function () {
var type = _this.gb.hms ? 'hms' : 'ymd';
var datesT = _this.gb.time;
if (_this.compareTime(datesT.year, datesT.month, datesT.date, type)) {
_this.getOkTime();
}
});
Calendar.addEvent(els.datesToday, 'click', function () {//获取当天时间
var isToday = true;
_this.initTimes(isToday);
});
//处理列表年月box
Calendar.addEvent(els.yearWrap, 'click', _this.yearLst, {els: els, that: _this});
Calendar.addEvent(_this.gb.datesBox, 'click', _this.ymLst, {els: els, that: _this});
//点击列表年月切换
_this.ymClick(els.yyConList, els.yyList, 'year');
_this.ymClick(els.mmConList, els.mmList, 'month');
Calendar.addEvent(els.monthWrap, 'click', function () {
if (els.mmList.style.display === 'none') {
if (document.activeElement !== els.iptMonth) {
els.mmList.style.display = 'block';
}
} else {
els.mmList.style.display = 'none';
}
});
//点击月份按钮切换
var btnList = {
mmPrev: [-1, 'month'],
mmNext: [1, 'month'],
yyPrev: [-1, 'year'],
yyNext: [-1, 'year']
};
for (i in btnList) {
Calendar.addEvent(els[i], 'click', _this.datesBtn, {
that: _this,
direction: btnList[i][0],
type: btnList[i][1]
});
}
for (i = 0; i < _this.gb.td.length; i++) {//日期点击切换
Calendar.addEvent(_this.gb.td[i], 'click', _this.getDate, {
that: _this
})
}
},
getDate:function(e){
var date = this.innerHTML,
_this = e.datas.that,
month = parseInt(this.getAttribute('m'), 10),
year;
if (_this.gb.time.month === 1 && month === 12) {
year = _this.gb.time.year - 1;
} else if (_this.gb.time.month === 12 && month === 1) {
year = _this.gb.time.year + 1;
} else {
year = _this.gb.time.year;
}
if (_this.compareTime(year, month, date)) {
_this.gb.time.year = year;
_this.gb.time.month = month;
_this.gb.time.date = date;
_this.insertDate();
_this.getOkTime();
}
},
yearLst: function (e) {//年下拉列表的处理（每次默认日期显示在可视区域）
var els = e.datas.els,
_this = e.datas.that;
if (els.yyList.style.display === 'none') {
if (document.activeElement !== els.iptYear) {
els.yyList.style.display = 'block';
for (var i = 0; i < els.yyConList.length; i++) {
if ((els.yyConList[i].getAttribute('dateValue')) === _this.gb.time.year) {
var dTop = els.yyConList[i].offsetTop;
if (dTop > 170) {
els.yyList.scrollTop = dTop;
}
}
}
}
} else {
els.yyList.style.display = 'none';
}
},
ymLst: function (e) {
var cuElt = e.srcElement || e.target,
els = e.datas.els,
_this = e.datas.that;
if ((!_this.contain(els.yearWrap, cuElt)) && (!_this.ishd(els.yyList))) {
els.yyList.style.display = 'none';
}
if ((!_this.contain(els.monthWrap, cuElt)) && (!_this.ishd(els.mmList))) {
els.mmList.style.display = 'none';
}
},
focusStatus: function () {
if (this.focus) {
this.select();
this.className = '';
}
},
combineTime: function (time, type) {
var times;
if (!time) {
return false;
}
var yy = time.year.toString(),
mm = this.formatTime(time.month.toString()),
dd = this.formatTime(time.date.toString()),
h = this.formatTime(time.hours.toString()),
m = this.formatTime(time.minutes.toString()),
s = this.formatTime(time.seconds.toString());
switch (type) {
case 'hms':
times = yy + mm + dd + h + m + s;
break;
case 'ymd':
times = yy + mm + dd;
break;
case 'ym':
times = yy + mm;
break;
case 'y':
times = yy;
break;
default :
times = yy + mm + dd;
}
return parseInt(times, 10);
},
compareTime: function (year, month, date, type) {
var _this = this,
dT = _this.gb.time,
curTime = _this.combineTime({
'year': year,
'month': month,
'date': date,
'hours': dT.hours,
'minutes': dT.seconds,
'seconds': dT.minutes
}, type),
minT = _this.combineTime(_this.gb.minTime, type) || '',
maxT = _this.combineTime(_this.gb.maxTime, type) || '';
if (minT && !maxT) {
return curTime < minT ? null : true;
}
if (!minT && maxT) {
return curTime > maxT ? null : true;
}
if (minT && maxT) {
return (curTime > maxT) || (curTime < minT) ? null : true;
}
return true;
},
initTimes: function (isToday) {
var iptDates = this.gb.target,
datesTime = this.checkTime(iptDates.value),
curDay,
year,
month,
hours,
minutes,
seconds, minTime, dates;
if (datesTime) {
datesTime = this.datesSplit(datesTime);
}
if (isToday) {
dates = new Date();
curDay = dates.getDate();
year = dates.getFullYear();
month = dates.getMonth() + 1;
hours = dates.getHours();
minutes = dates.getMinutes();
seconds = dates.getSeconds();
} else if (!isToday && datesTime) {
curDay = datesTime.date;
year = datesTime.year;
month = datesTime.month;
hours = datesTime.hours;
minutes = datesTime.minutes;
seconds = datesTime.seconds;
} else if (!isToday && !this.gb.minTime && !this.gb.maxTime && !datesTime) {
dates = new Date();
curDay = dates.getDate();
year = dates.getFullYear();
month = dates.getMonth() + 1;
hours = 0;
minutes = 0;
seconds = 0;
} else if (!datesTime && (this.gb.minTime || this.gb.maxTime)) {
minTime = this.gb.minTime || this.gb.maxTime;
curDay = minTime.date;
year = minTime.year;
month = minTime.month;
hours = minTime.hours;
minutes = minTime.minutes;
seconds = minTime.seconds;
}
this.gb.time = {
'year': year,
'month': month,
'date': curDay,
'hours': hours,
'minutes': minutes,
'seconds': seconds
};
this.insertDate();
},
viewTb: function () {
var week = ['日', '一', '二', '三', '四', '五', '六'],
tr = [],
num = 0;
var table = this.creatEle("table"),
thead = this.creatEle("thead"),
tbody = this.creatEle("tbody");
table.className = "dates_table";
table.id = "dates_table";
for (var i = 1; i < 8; i++) {
var th = this.creatEle('th');
this.append(th, thead);
th.innerHTML = week[i - 1];
}
for (i = 1; i < 7; i++) {
tr[i] = this.creatEle('tr');
this.append(tr[i], tbody);
for (var j = 1; j < 8; j++) {
var ctTd = this.creatEle("td");
ctTd.setAttribute('index', num++);
this.append(ctTd, tr[i]);
}
}
this.append(thead, table);
this.append(tbody, table);
return table.outerHTML;
},
insertDate: function () {
var els = this.gb.els,
datesTime = this.gb.time,
yyConList = els.yyConList,
mmConList = els.mmConList,
iptYear = els.iptYear,
iptMonth = els.iptMonth,
iptHours = els.iptHours,
iptMinutes = els.iptMinutes,
iptSeconds = els.iptSeconds,
year = datesTime.year,
month = parseInt(datesTime.month, 10),
date = datesTime.date,
hours = datesTime.hours,
minutes = datesTime.minutes,
seconds = datesTime.seconds,
td = this.gb.td,
mVal,
yVal;
var dates = new Date();
dates.setFullYear(year, month - 1);
dates.setDate(1);
var day = dates.getDay();
var curMonthDays = this.getDays(year, month - 1);
this.dateStatus(mmConList, month, 'current');
this.dateStatus(yyConList, year, 'current');
//日期列表
for (var i = 0; i < curMonthDays; i++) {
td[day + i].innerHTML = i + 1;
td[day + i].className = '';
if (i + 1 === date) {
td[day + i].className = 'current_day';
} else if (date > curMonthDays) {
td[day + curMonthDays - 1].className = 'current_day';
this.gb.time.date = curMonthDays;
}
td[day + i].setAttribute('m', month);
td[day + i].setAttribute('y', year);
}
for (i = 0; i < day; i++) {
td[day - i - 1].className = "other_day";
td[day - i - 1].innerHTML = this.getDays(year, month - 2) - i;
if (!(month - 1 > 0)) {
mVal = 12;
yVal = year - 1;
} else {
mVal = month - 1;
yVal = year;
}
td[day - i - 1].setAttribute('m', mVal);
td[day - i - 1].setAttribute('y', yVal);
}
for (i = 0; i < td.length - day - curMonthDays; i++) {
td[day + curMonthDays + i].className = "other_day";
td[day + curMonthDays + i].innerHTML = i + 1;
if (month + 1 > 12) {
mVal = 1;
yVal = year + 1;
} else {
mVal = month + 1;
yVal = year;
}
td[day + curMonthDays + i].setAttribute('m', mVal);
td[day + curMonthDays + i].setAttribute('y', yVal);
}
var minT = this.combineTime(this.gb.minTime) || '';
var maxT = this.combineTime(this.gb.maxTime) || '';
var curTime = {
'year': year,
'month': month,
'date': date,
'hours': this.gb.time.hours,
'minutes': this.gb.time.minutes,
'seconds': seconds
};
if (minT) {
for (i = 0; i < td.length; i++) {//日期列表处理
curTime.year = td[i].getAttribute('y');
curTime.date = td[i].innerHTML;
curTime.month = td[i].getAttribute('m');
if (this.combineTime(curTime) < minT) {
td[i].className = "disable_day";
}
}
for (i = 0; i < yyConList.length; i++) {
if (yyConList[i].getAttribute('dateValue') < this.gb.minTime.year) {
yyConList[i].className = "disable_day";
}
}
for (i = 0; i < mmConList.length; i++) {//月份列表处理
if (datesTime.year + this.formatTime(mmConList[i].getAttribute('dateValue')) < this.combineTime(this.gb.minTime, 'ym')) {
mmConList[i].className = "disable_day";
}
}
}
if (maxT) {
for (i = 0; i < td.length; i++) {//日期列表处理
curTime.year = td[i].getAttribute('y');
curTime.date = td[i].innerHTML;
curTime.month = td[i].getAttribute('m');
if (this.combineTime(curTime) > maxT) {
td[i].className = "disable_day";
}
}
for (i = 0; i < yyConList.length; i++) {//年列表处理
if (yyConList[i].getAttribute('dateValue') > this.gb.maxTime.year) {
yyConList[i].className = "disable_day";
}
}
for (i = 0; i < mmConList.length; i++) {//月份列表处理
if (datesTime.year + this.formatTime(mmConList[i].getAttribute('dateValue')) > this.combineTime(this.gb.maxTime, 'ym')) {
mmConList[i].className = "disable_day";
}
}
}
iptYear.value = year;
iptMonth.value = this.formatTime(month);
iptHours.value = this.formatTime(hours);
iptMinutes.value = this.formatTime(minutes);
iptSeconds.value = this.formatTime(seconds);
},
ymClick: function (listObj, parent, type) {
var _this = this, year, month, date;
for (var i = 0; i < listObj.length; i++) {//月份点击切换
listObj[i].onclick = changeM;
}
function changeM() {
if (type === 'month') {
month = this.getAttribute('dateValue');
year = _this.gb.time.year;
date = _this.gb.time.date;
} else if (type === 'year') {
year = this.getAttribute('dateValue');
month = _this.gb.time.month;
date = _this.gb.time.date;
}
if (_this.compareTime(year, month, date)) {
_this.gb.time.year = year;
_this.gb.time.month = month;
_this.gb.time.date = date;
_this.removeStatus(listObj);
this.className = 'current';
parent.style.display = 'none';
_this.insertDate();
}
}
},
ishd: function (obj) {
return obj.style.display === 'none' ? true : null;
},
shde: function (obj, controller) {
if (!controller) {
obj.style.display = (obj.style.display === 'block' ? 'none' : 'block');
} else if (controller === 1) {
obj.style.display = 'none';
} else if (controller === 2) {
obj.style.display = 'block';
}
},
isExistObj: function (arr, els) {
if (typeof arr === 'object' && arr.length) {
for (var i = 0; i < arr.length; i++) {
if (arr[i] === els) {
return true;
}
}
} else if (arr === els) {
return true;
}
return false;
},
checkFocus: function (str, that, replaceStr, type) {
that.className = 'dlt_status';
var val = that.value;
var reg = new RegExp(str);
if (!(reg.test(val))) {
that.value = replaceStr;
} else {
this.gb.time[type] = this.formatTime(val);
that.value = this.gb.time[type];
}
return that.value;
},
datesBtn: function (e) {
var _this = e.datas.that,
year = _this.gb.time.year,
month = _this.gb.time.month,
yy = parseInt(year, 10),
mm = parseInt(month, 10),
dd = _this.gb.time.date,
type = e.datas.type,
direction = e.datas.direction;
if (type === 'month') {
if (mm === 1 && (direction < 0)) {
month = 12;
year = yy + direction;
} else if (mm === 12 && (direction > 0)) {
month = 1;
year = yy + 1;
} else {
month = mm + direction;
}
var lastDay = _this.getDays(year, month - 1);
if (dd > lastDay) {
dd = lastDay;
}
} else if (type === "year") {
year = yy + direction;
}
_this.gb.time.year = year;
_this.gb.time.month = month;
_this.gb.time.date = dd;
_this.insertDate();
},
removeStatus: function (obj) {
for (var i = 0; i < obj.length; i++) {
obj[i].className = '';
}
},
dateStatus: function (obj, matchValue, style) {//样式实时切换
for (var i = 0; i < obj.length; i++) {
obj[i].className = '';
if (obj[i].getAttribute('dateValue') === matchValue) {
obj[i].className = style;
}
}
},
getOkTime: function () {
var tmpArr = {},
fmt = this.gb.format,
Hms,
hms;
for (var i in this.gb.time) {
tmpArr[i] = this.formatTime(this.gb.time[i]);
}
hms = ' ' + tmpArr.hours + ':' + tmpArr.minutes + ':' + tmpArr.seconds;
Hms = this.gb.hms ? hms : '';
this.gb.target.value = tmpArr.year + fmt + tmpArr.month + fmt + tmpArr.date + Hms;
this.shde(this.gb.datesBox);
},
checkTime: function (datesTime) {
var fmt = '[-\/]',
timesFat = this.gb.hms ? '(\\s){1}((0?[0-9])|(1[0-9])|(2[0-3])):([0-5][0-9]):([0-5][0-9])' : '',
datesTimes = datesTime ? (datesTime.replace(/^(\s*)|(\s*)$/g, '').replace(/(\s)+/g, ' ')) : '',
datesPat = new RegExp("^((19[0-9]{2})|(2[0-9]{3}))" + fmt + "((0?[1-9])|(1[0-2]))" + fmt + "((0?[1-9])|(1[0-9])|(2[0-9])|(3[0-1]))" + timesFat + "$");
if (datesPat.test(datesTimes)) {
return datesTimes;
} else {
return false;
}
},
formatTime: function (time) {
return /^(\d){1}$/.test(time) ? '0' + time : time;
},
getDays: function (year, month) {
var febDays;
if (month < 0) {
month = 11;
year = year - 1;
} else if (month > 11) {
month = 0;
year = year + 1;
}
if ((month + 1) === 2) {
if ((year % 4 === 0 && year % 100 !== 0) || year % 400 === 0) {
febDays = 29;
} else {
febDays = 28;
}
}
var arrM = [31, febDays, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
return arrM[month];
},
creatEle: function (context, parent) {
var docEle = parent || document;
return docEle.createElement(context);
},
append: function (context, parent) {
var docEle = parent || document.body;
return docEle.appendChild(context);
},
setPosition: function (target, dateBox, position) {
if (position && typeof position === 'object') {
dateBox.style.left = 0;
dateBox.style.top = 0;
return false;
}
var iptP = this.getOffset(target),
iptLeft = iptP.left,
iptTop = iptP.top,
dtH = dateBox.offsetHeight,
tgtH = target.offsetHeight,
scrtH = this.resetSizeAttr('scrollTop'),
bdH = this.resetSizeAttr('offsetHeight');
var distTop = iptTop - scrtH;
if (bdH - distTop > dtH) {
dateBox.style.top = iptTop + tgtH - 1 + 'px';
} else {
dateBox.style.top = iptTop - dtH + 1 + 'px';
}
dateBox.style.left = iptLeft + 'px';
},
resetSizeAttr: function (attr, els) {
var elt = els || document.body;
return elt[attr] || (document.documentElement && document.documentElement[attr]);
},
getOffset: function (obj, objPosition) {
var objP = objPosition || {left: 0, top: 0};
if (obj) {
objP.left += obj.offsetLeft;
objP.top += obj.offsetTop;
if (obj.offsetParent) {
obj = obj.offsetParent;
arguments.callee(obj, objP);
}
}
return objP;
},
contain: function (parent, child) {//为了解决mouseover/mouseout 的时间重叠，所以判断是否包含
return (document.all ? (parent.contains(child)) : (((parent.compareDocumentPosition(child) === 20) || (parent === child)) ? true : null));
}
};
Calendar.enable = function (obj, trigger, opts) {
Calendar.addEvent(obj, 'click', function () {
if (!win.xvDate.Dates) {
win.xvDate.Dates = new Calendar.fn.init(opts, trigger);
} else {
win.xvDate.Dates.init(opts, trigger);
}
});
};
Calendar.getId = function (id, parent) {
var doc = parent ? parent : document;
return doc.getElementById(id);
};
Calendar.addEvent = function (obj, type, fn, opts) {
obj['evt' + type + fn] = obj['evt' + type + fn] || null;
if (!obj['evt' + type + fn]) {
obj['evt' + type + fn] = function (event) {
event = event || window.event;
event.datas = opts || {};
fn.call(obj, event);
};
}
if (obj.addEventListener) {//W3C
obj.addEventListener(type, obj['evt' + type + fn], false);
} else if (obj.attachEvent) {
obj.attachEvent('on' + type, obj['evt' + type + fn]);
}
};
Calendar.removeEvent = function (obj, type, fn) {//删除事件这个在上面的基础上就比较容易点了
if (typeof obj.removeEventListener !== 'undefined') {
obj.removeEventListener(type, obj['evt' + type + fn], false);
} else if (typeof obj.detachEvent !== 'undefined') {
if (fn && obj['evt' + type + fn]) {
obj.detachEvent("on" + type, obj['evt' + type + fn]);
}
}
};
Calendar.fn.init.prototype = Calendar.fn;
});
相关推荐
在本场景中，我们关注的是一个特定的GUI组件，即“滑动日历选择控件”，它常用于PC和IPC（Industrial Personal Computer，工业个人计算机）上的用户界面，以帮助用户方便地选取日期。这个控件对于需要用户输入日期的...
本主题将深入探讨如何自定义一个带有图片的Toast以及改造日历选择控件。 首先，我们来看“自定义Toast”。原生的Toast类在Android系统中提供了简单快速的方式来显示短暂的信息提示，但它默认样式较为单一，无法满足...
`swift-RCalendarPicker` 是一个专为Swift编程语言设计的日历选择控件，它提供了一个美观且易于使用的界面，使用户能够方便地浏览和选择日期。这个库特别适用于那些需要集成自定义日历功能的iOS应用。 首先，`...
My97 DatePicker 是一个非常流行的JavaScript日历插件，它功能强大，自定义选项丰富，支持多种语言，并且在各种浏览器上都有良好的兼容性。本文将详细介绍My97 DatePicker 的使用方法及其核心特性。 首先，我们来看...
在移动应用开发中，日历选择插件是一个非常常见的组件，尤其在处理日期输入或事件安排时。"日历选择插件适用于移动端"这个标题暗示我们这里涉及的是一个专为移动设备优化的JavaScript库，用于在触屏设备上提供友好的...
日历插件则是小程序中的一个重要组件，它的实现通常涉及到以下几个关键知识点： 1. **自定义组件**：在小程序中，开发者可以通过自定义组件来扩展其功能，这正是"极点日历"小组件的核心。自定义组件可以复用，提高...
总的来说，“CSS+HTC日历选择控件”是一个专为IE浏览器设计的交互式日期选择工具，它结合了CSS和JavaScript的技术优势，提供了一种直观、便捷的日期输入方式。虽然它不支持其他非IE浏览器，但在IE盛行的时期，这类...
本文将深入探讨“一个简单实用的JS/JQuery日历选择控件”的知识点，结合给出的标签“源码”和“工具”，我们可以推断这是一个关于自定义日历插件的教程或示例。 首先，日历选择控件是网页应用中常见的一种组件，...
只需要把该类文件添加到开发项目中，datagridview中就会自动出现日历的列类型选择。由于是cs 类文件适用于任何c#版本。
在网页开发中，为了提供用户友好的界面，经常会使用到日历选择插件。这个名为“JS日历插件日期选择...如果你正在为你的网页项目寻找一个快速、可靠的日期选择解决方案，这个JS日历插件日期选择器可能是值得考虑的选择。
在iOS应用开发中，UI设计和用户体验至关重要，而日历选择控件是许多应用程序中常见的交互元素，尤其在处理日期相关的功能时。Swift语言提供了强大的工具和库来创建自定义的用户界面，其中之一就是名为“swift-一个...
### ASP.NET弹出式日历选择控件的实现 #### 背景介绍 在进行多个项目的开发过程中，经常会遇到需要使用日期选择器的情况。为了提高用户体验并解决页面刷新、多控件之间的数据传递等问题，设计一个弹出式的日历选择...
日历选择控件是网页中常见的用户界面元素，用于方便用户选取日期。本文将深入探讨如何利用JavaScript实现一个高度可定制的日历选择控件，并讨论相关的编程技术。 在JavaScript中创建日历选择控件，首先我们需要理解...
**jQuery简单的周日历选择插件** 在网页开发中，日期选择器是一个常见的交互元素，用于用户输入日期信息。jQuery库提供了丰富的插件，使得创建这样的功能变得简单易行。本教程将介绍一款专为周日历选择设计的jQuery...
1. **引入依赖**：在页面中引入jQuery库和日历插件的JavaScript及CSS文件。 2. **初始化插件**：在需要日期选择功能的元素上应用插件，如`<input type="text">`。 ```html $(document).ready(function(){ $('#...
在Android应用开发中，模拟iPhone提醒事项日历选择控件是一项常见的需求，特别是在构建跨平台应用时。这个控件能够为用户提供与iPhone类似的交互体验，包括按天选择和按月选择的功能，使得用户能方便地设定提醒或者...
JavaScript编写的日历选择控件是一种常见的前端交互元素，它为用户提供了一个图形化的界面来选择日期，常用于表单输入、事件安排或者时间相关的应用程序。本文将深入探讨JavaScript日历控件的实现原理、功能特性以及...
8. **插件化和模块化**：在项目中，这个日历控件可能被设计成一个独立的模块或插件，便于与其他代码库集成，同时保持代码的组织和可维护性。 9. **国际化支持**：考虑到全球用户的需求，控件可能还支持日期格式的...
《深入理解jQuery双日历选择插件：double-date实践指南》 在当今的Web开发领域，jQuery库以其简洁易用的API和强大的功能，成为众多开发者首选的JavaScript库。而"double-date双日历选择插件jQuery代码"是jQuery生态...
之前在网上想找一个简单易用的周日历选择插件，发现这种前端周日历插件很少，而且很多文章写的周的算法都不是统一的，所以自己实现了一个基于jquery的周日历插件(还支持跳转到指定年份和周哦)。 插件中周的算法：...