最近在鑽研前端,寫了個日期控制項,內涵**注釋,希望能幫助到大家~
//顯示日曆
function showdate(year, month)
//當月份為12時 下乙個月為1
else
if (month == 12
)
var titlehtml = ""
; titlehtml += '';
titlehtml += prevm + '月'
; titlehtml += '';
titlehtml += '';
titlehtml +=year;
titlehtml += '年'
; titlehtml += '
' +month;
titlehtml += '月'
; titlehtml += '';
titlehtml += nextm + '月'
; otitle.innerhtml =titlehtml;
//將日曆標題 拼接到日曆
獲取日曆 表頭元素(以便新增事件)
var ospans = ocalender.getelementsbytagname('
span');
var prevmonth = ospans[0
];
var nextmonth = ospans[3
];
var nowmonth = ospans[2
];
var nowyear = ospans[1
];
//2.建立星期 表頭
var otable = document.createelement('
table');
var othead = document.createelement('
thead');
var otr = document.createelement('tr'
);
表頭內容填充
var arr = ['
日', '
一', '
二', '
三', '
四', '
五', '六'
];
for (var i = 0; i < arr.length; i++)
將表頭加入到日曆
//3.新增 當前日曆 全部日期
先獲得當期月 有多少天
var daynum = 0
;
if (month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12
) else
if (month == 4 || month == 6 || month == 9 || month == 11
) else
if (month == 2 &&isleapyear(year))
else
建立 6行7列 日期容器
var otbody = document.createelement('
tbody');
for (var i = 0; i < 6; i++)
}獲得 1號對應的是星期幾
.1.將當月1號賦值給日期變數
odate.setfullyear(year);
//注意 js日期的月份是從0 開始計算
odate.setmonth(month - 1
); odate.setdate(1);
.2.計算1號在第一行日期容器中的位置,依次給日期容器填充內容
//注意 js中 getday方法是獲取當前日期是星期幾
var week =odate.getday();
var otds = ocalender.getelementsbytagname('td'
);
for (var i = 0; i < daynum; i++)
//讓當前日期顯示紅色、後面的顯示藍色
showcolor(otds);
//給左右月份繫結點選事件
monthevent();
//判斷最後一行是否全為空
lasttr(otds);
flag = true
; document.getelementbyid(
'calender
').style.display = "
block";}}
//判斷是否是閏年
function isleapyear(year)
else
if (year % 100 != 0 && year % 4 == 0
) else
}//判斷日期容器最後一行是否有值
function lasttr(otds)
}//全是空的
if(flag) }}
//當前日期顯示紅色、前面的顯示灰色
function showcolor(otds) }}
//給左右月份繫結點選事件
function monthevent()
nextdiv.onclick =function () }}
js日期控制項
var months new array 一月 二月 三月 四月 五月 六月 七月 八月 九月 十月 十一月 十二月 var daysinmonth new array 31,28,31,30,31,30,31,31,30,31,30,31 var days new array 日 一 二 三 四 ...
js 是實現網頁日期控制項
var calendermonth 0 function jcalendar year,month,date jcalendar.prototype.show function html str.push html str.push html str.push for var i 0 i 7 i h...
js 日期控制項WdatePicker設定最小時間
html script 對date的擴充套件,將 date 轉化為指定格式的string 月 m 日 d 小時 h 分 m 秒 s 季度 q 可以用 1 2 個佔位符,年 y 可以用 1 4 個佔位符,毫秒 s 只能用 1 個佔位符 是 1 3 位的數字 例子 new date format yyy...