公司的一个日历控件有问题,让我看哪有问题,看起来真复杂,我就先写了一个日历,看实现原理是什么 也不怎么会表达,一行一行的coding完了,就这样了 预览地址output.jsbin.com/qayisezula 核心代码
drawDate: function (opt) {
var nowdata = new Date().getDate();
var nowmonth = new Date().getMonth();
var nowyear = new Date().getFullYear();
var month = this._month;
var year = this._year;
var val = this._year + '/' + (this._month+1) + '/' + nowdata;
var oid = document.getElementById(this.id);
oid.value = val;
var showmonth = month + 1;
//当前月有多少天
var numdays = this.mdays(year)[month];
var first_date = new Date(year, month, 1);
//获取当月第一天是星期几
var first_day = first_date.getDay();
//第一天是星期几加上总天数,一个星期共有7天,除以7,就是行数,只能多不能少,所以用Math.ceil向上取整数
var str_num = Math.ceil((first_day + numdays) / 7);//得到表格有多少行
var str_table = '<tr><td><a href="javascript:void(0);" id="pre"><</a></td><td colspan="3">' + year + '年</td><td colspan="2">' + showmonth + '月</td><td><a href="javascript:void(0);" id="next">></a></td></tr><tr><td >日</td><td >一</td><td >二</td><td >三</td><td >四</td><td >五</td><td >六</td></tr>';
var table = document.createElement('table');
table.innerHTML = str_table;
for (var i = 0; i < str_num; i++) {
var tr = document.createElement('tr');
for (var j = 0; j < 7; j++) {
var td = document.createElement('td');
var idx = i * 7 + j;
date_num = idx - first_day + 1;
td.innerHTML = date_num;
if (date_num < 1 || date_num > numdays) {
td.innerHTML = '';
}
if (date_num == nowdata && nowyear == year && month == nowmonth) {
td.className = 'now'
}
tr.appendChild(td);
}
table.appendChild(tr);
}
table.id = 'lytable';
// console.log(table.innerHTML);
document.body.appendChild(table);
this.getpos();
this.listen();
}
全都代码在这 github.com/ralcen/jque…