<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">
.rili { width: 196px; border:1px solid #C0D0E8; }
.rili table {
width: 190px;
border: 0;
background: #bae1f0;
}
.rili table td { padding:2px; background: #fff; }
.time { border: 0; background: #fff; }
.time th { background: #effaff; }
.time td { text-align: center; cursor: pointer; background: #fff; }
.close { width:60px;line-height:21px;display:block;border:1px solid #bdd1ea;cursor:pointer;font-size:12px;font-weight:bold;background:#f3faff; }
span.s { width: 16px; cursor: pointer; color: #eef3f7;font-weight:bold; background:#a5b6ca; }
</style>
<script type="text/javascript">
document.write("<div id=\"showDate\" style=\"display: none; Z-INDEX: 2; BACKGROUND: #effaff; FILTER: Alpha(opacity=85); position: absolute; WIDTH: 200px; LINE-HEIGHT: 22px; padding:6px; border: 1px solid #bae1f0; font-size:14px;\"></div>");
var id;
//** 此段转自于javaeye 相关链接:http://www.javaeye.com/problems/60028 **//
//让firefox支持 event全局对象,srcElement对象
function __firefox(){
HTMLElement.prototype.__defineGetter__("runtimeStyle", __element_style);
window.constructor.prototype.__defineGetter__("event", __window_event);
Event.prototype.__defineGetter__("srcElement", __event_srcElement);
}
function __element_style(){
return this.style;
}
function __window_event(){
return __window_event_constructor();
}
function __event_srcElement(){
return this.target;
}
function __window_event_constructor(){
if(document.all){
return window.event;
}
var _caller = __window_event_constructor.caller;
while(_caller!=null){
var _argument = _caller.arguments[0];
if(_argument){
var _temp = _argument.constructor;
if(_temp.toString().indexOf("Event")!=-1){
return _argument;
}
}
_caller = _caller.caller;
}
return null;
}
if(window.addEventListener){
__firefox();
}
//** 此段转自于javaeye 相关链接:http://www.javaeye.com/problems/60028 **//
function showDate(ids) {
id = ids;
var divVal = document.getElementById("showDate");
var clickX = event.clientX;
var clickY = event.clientY;
// 加px 兼容火狐
divVal.style.left = (clickX + 1) + "px";
divVal.style.top = (clickY + 1) + "px";
// 得到系统日期
var nowDate = new Date();
selectDate(nowDate.getYear(), nowDate.getMonth());
}
// 主要函数 调用相关函数生成DIV层 显示日期
function selectDate(nowYear, nowMonth) {
nowYear = (nowYear < 1900 ? (1900 + nowYear) : nowYear);
var showTable = "<div class=\"rili\" ><table cellpadding=0 cellspacing=0 valign=top >";
showTable += showYear(nowYear, nowMonth);
showTable += showWeek();
showTable += showDates(nowYear, nowMonth);
showTable += "<tr><td colspan=\"2\" align=\"left\"><div id=\"times\"></div></td></tr><tr><td colspan=\"2\" align=\"center\"><div onclick=\"closeDiv()\" class=\"close\">关闭</div></td></tr></table></div></div>";
var divVal = document.getElementById("showDate");
divVal.innerHTML = showTable;
divVal.style.display = "block";
}
function closeDiv() {
var divVal = document.getElementById("showDate");
divVal.style.display = "none";
}
// 输出年月
function showYear(nowYear, nowMonth) {
var td = "";
td += "<tr><td><span class=\"s\" onclick=\"preYear(" + nowYear + ", " + nowMonth + ");\"><<</span>";
td += (" " + nowYear);
td += "年 ";
td += "<span class=\"s\" onclick=\"nextYear(" + nowYear + ", " + nowMonth + ");\">>></span>";
td += "</td><td><span class=\"s\" onclick=\"preMonth(" + nowYear + ", " + nowMonth + ");\"><<</span> ";
if((parseInt(nowMonth) + 1) < 10) {
td += "0";
}
td += (parseInt(nowMonth) + 1);
td += "月 ";
td += "<span class=\"s\" onclick=\"nextMonth(" + nowYear + ", " + nowMonth + ");\">>></span></td></tr>";
return td;
}
// 输出星期
function showWeek() {
var week = "";
week += "<tr><td cellpadding=\"0\" cellspacing=\"1\" colspan=\"2\"><table class=\"time\" border=\"0\"><tr >";
week += "<th>日</th>";
week += "<th>一</th>";
week += "<th>二</th>";
week += "<th>三</th>";
week += "<th>四</th>";
week += "<th>五</th>";
week += "<th>六</th>";
week += "</tr>";
return week;
}
// 输出日期
function showDates(nowYear, month) {
var da = new Date();
da.setYear(nowYear);
da.setMonth(parseInt(month));
da.setDate(1);
var day = da.getDay();
var dates = getDates(nowYear, month);
var tb = "";
var n = 0;
var isPrint = "";
var k = 0;
for(var i = 0; i < 6; i++) {
tb += "<tr>";
for(var j = 1; j <= 7; j++) {
n ++;
if(i == 0 && j <= day) {
tb += "<td sytle=\"line-height: 16;\"> </td>";
} else {
k++;
if(k <= dates) {
if(k == da.getDate()) {
tb += ("<td onclick=\"getCurDate(" + nowYear + ", " + month + ", " + k + ")\"><font color=\"green\" style=\"font-weight:bold\">" + k + "</font></td>");
} else {
tb += ("<td onclick=\"getCurDate(" + nowYear + ", " + month + ", " + k + ")\"><font color=\"red\" style=\"font-weight:bold\">" + k + "</font></td>");
}
} else {
tb += "<td sytle=\"line-height: 16;\"> </td>";
}
}
}
tb += "</tr>";
}
tb += "</table></td></tr>";
return tb;
}
// 年月操作
function preYear(nowYearh, nowMonth) {
selectDate(nowYearh - 1, nowMonth);
}
function nextYear(nowYearh, nowMonth) {
selectDate(nowYearh + 1, nowMonth);
}
function preMonth(nowYearh, nowMonth) {
if(nowMonth == 0) {
selectDate(nowYearh - 1, 11);
} else {
selectDate(nowYearh, nowMonth - 1);
}
}
function nextMonth(nowYearh, nowMonth) {
if(nowMonth == 11) {
selectDate(nowYearh + 1, 0);
} else {
selectDate(nowYearh, nowMonth + 1);
}
}
// 设置
function getCurDate(year, month, date) {
var cMonth = "";
var cDate = "";
if(date < 1) {
cDate = "1";
} else {
cDate = date + "";
}
if(date < 10) {
cDate = "0" + date;
}
if(month < 10) {
cMonth = "0" + (month + 1);
}
document.getElementById(id).value = year + "-" + cMonth + "-" + cDate;
closeDiv();
}
// 得到日期天数
function getDates(year, month) {
month += 1;
switch(month) {
case 2:
if(((year % 4) == 0 && (year % 00) != 0) ||
(year % 400) == 0)
dates = 29;
else
dates = 28;
break;
case 4:
case 6:
case 9:
case 11:
dates = 30;
break;
default:
dates = 31;
}
return dates;
}
</script>
</head>
<body>
<input type="text" id="startDate" value="" onclick="showDate(this.id);" />
</body>
</html>