javascript日历共享
//Base code from E.Suez - esuez@mail.utexas.edu
//Base code available at http://uts.cc.utexas.edu/~esuez/cal5.html
//Modified by A.Pocock - anthony@wnc.com.au - http://www.wnc.com.au
//Mods include:
//- Change to ddmmyyyy format
//- removed dropdown list functionality
//- added support to return a ddmmyy value to a field
//- ability to open calendar to current value of the selected field
//- support for multiple date selectors on a page to return values to different fields
//- developed specifically to be compatible with Lotus Domino R5, but should work with other IDE´s
//
//To install Date Picker:
//- Copy code listed below to the JavaScript header
//- in the onClick() event of the button or graphic which is to spawn the calendar, include
// a function call to opencalendar("fieldname") passing the fieldname you want the date returned
// to as the parameter.
//- make calls to opencalendar("fieldname") for any subsequent fields which need a Date Picker.
//
//
//Comments and suggestions are welcome. Send to anthony@wnc.com.au
//A demo of this working under domino can be seen at http://www.wnc.com.au/products/datepick.nsf
var dayA = new Array();
var monthA = new Array();
var yearA = new Array();
var targetfield;
monthA[0]="一月";
monthA[1]="二月";
monthA[2]="三月";
monthA[3]="四月";
monthA[4]="五月";
monthA[5]="六月";
monthA[6]="七月";
monthA[7]="八月";
monthA[8]="九月";
monthA[9]="十月";
monthA[10]="十一月";
monthA[11]="十二月";
for(var i=1;i<=31;i++)
{
dayA[i]=i;
}
for(var i=0;i<10;i++)
{
yearA[i]=gy(i);
}
function gm(num) {
var mydate = new Date();
mydate.setDate(1);
mydate.setMonth(num-1);
var datestr = "" + mydate;
return datestr.substring(4,7);
}
function gy(num) {
var mydate = new Date();
return (eval(mydate.getYear()) - 4 + num);
}
function ud(mon) {
var i = mon.selectedIndex;
if(mon.options[i].value == "2") {
document.forms[0].day.options[30] = null;
document.forms[0].day.options[29] = null;
var j = document.forms[0].year.selectedIndex;
var year = eval(document.forms[0].year.options[j].value);
if ( ((year%400)==0) || (((year%100)!=0) && ((year%4)==0)) ) {
if (document.forms[0].day.options[28] == null) {
document.forms[0].day.options[28] = new Option("29");
document.forms[0].day.options[28].value = "29";
}
} else {
document.forms[0].day.options[28] = null;
}
}
if(mon.options[i].value == "1" ||
mon.options[i].value == "3" ||
mon.options[i].value == "5" ||
mon.options[i].value == "7" ||
mon.options[i].value == "8" ||
mon.options[i].value == "10" ||
mon.options[i].value == "12")
{
if (document.forms[0].day.options[28] == null) {
document.forms[0].day.options[28] = new Option("29");
document.forms[0].day.options[28].value = "29";
}
if (document.forms[0].day.options[29] == null) {
document.forms[0].day.options[29] = new Option("30");
document.forms[0].day.options[29].value = "30";
}
if (document.forms[0].day.options[30] == null) {
document.forms[0].day.options[30] = new Option("31");
document.forms[0].day.options[30].value = "31";
}
}
if(mon.options[i].value == "4" ||
mon.options[i].value == "6" ||
mon.options[i].value == "9" ||
mon.options[i].value == "11")
{
if (document.forms[0].day.options[28] == null) {
document.forms[0].day.options[28] = new Option("29");
document.forms[0].day.options[28].value = "29";
}
if (document.forms[0].day.options[29] == null) {
document.forms[0].day.options[29] = new Option("30");
document.forms[0].day.options[29].value = "30";
}
document.forms[0].day.options[30] = null;
}
if (document.forms[0].day.selectedIndex == -1)
document.forms[0].day.selectedIndex = 0;
}
function showdate() {
var i = document.forms[0].month.selectedIndex;
var j = document.forms[0].day.selectedIndex;
var k = document.forms[0].year.selectedIndex;
alert(document.forms[0].day.options[j].value + "/" +
document.forms[0].month.options[i].value + "/" +
document.forms[0].year.options[k].value)
}
function opencalendar(temptargetfield) {
var field= eval("document.forms[0]." + temptargetfield);
targetfield = "opener.document.forms[0]." + temptargetfield + ".value";
var mydate;
if(field.value == "" || field.value.length < 10 || field.value.length >10)
{
mydate = new Date();
}
else
{
var tempday = field.value.charAt(0).toString() + field.value.charAt(1).toString();
var tempmonth = (parseInt((parsemonth(field.value.charAt(3).toString(), field.value.charAt(4).toString())))-1).toString();
var tempyear = (parseInt(field.value.charAt(6).toString() + field.value.charAt(7).toString() + field.value.charAt(8).toString() + field.value.charAt(9).toString())).toString();
mydate = new Date(tempyear, tempmonth, tempday );
}
for(var i=0;i<=monthA.length;i++)
{
if (mydate.getMonth() == i)
{
month = i+1;
}
}
year = mydate.getYear();
//yearA[4].toString();
calwin = window.open("","calwin","height=220,width=180");
calccal(calwin,month,year,targetfield);
}
function parsemonth(tmpm1, tmpm2)
{
var m1;
var m2;
var m3;
if (tmpm1 == "0")
{
m1 = "";
}
else
{
m1 = "1";
}
m2 = tmpm2;
m3 = m1.toString() + m2.toString();
return m3;
}
function calccal(targetwin,month,year,targetfield) {
var monthname = new Array(12);
monthname[0] = "一月";
monthname[1] = "二月";
monthname[2] = "三月";
monthname[3] = "四月";
monthname[4] = "五月";
monthname[5] = "六月";
monthname[6] = "七月";
monthname[7] = "八月";
monthname[8] = "九月";
monthname[9] = "十月";
monthname[10] = "十一月";
monthname[11] = "十二月";
var endday = calclastday(eval(month),eval(year));
mystr = month + "/01/" + year;
mydate = new Date(mystr);
firstday = mydate.getDay();
var cnt = 0;
var day = new Array(6);
for (var i=0; i<6; i++)
day[i] = new Array(7);
for (var r=0; r<6; r++)
{
for (var c=0; c<7; c++)
{
if ((cnt==0) && (c!=firstday))
continue;
cnt++;
day[r][c] = cnt;
if (cnt==endday)
break;
}
if (cnt==endday)
break;
}
targetwin.document.write("<script lanuage=javascript>moveTo(,(screen.height/2-110));</script>");
targetwin.document.write("<HTML><HEAD><TITLE>?x?袢掌?</TITLE>");
targetwin.document.write("<STYLE>TABLE{COLOR: buttontext; FONT-SIZE:12px ;FONT-FAMILY: Verdana, Arial, Helvetica;}");
targetwin.document.write(".headerTable {BACKGROUND: #CCFFCC; WIDTH: 100%; COLOR: buttontext; FONT-SIZE:12px ;FONT-FAMILY: Verdana, Arial, Helvetica;}");
targetwin.document.write(".listTD {BORDER-RIGHT: buttonshadow 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: buttonhighlight 1px solid; PADDING-LEFT: 3px; OVERFLOW: hidden; BORDER-LEFT: buttonhighlight 1px solid; BORDER-BOTTOM: buttonshadow 1px solid}");
targetwin.document.write("INPUT{BACKGROUND-COLOR: #CCCCCC; BORDER-BOTTOM: #999999 1px solid; BORDER-LEFT: #EFEFEF 1px solid; BORDER-RIGHT: #999999 1px solid; BORDER-TOP: #EFEFEF 1px solid; FONT-SIZE: 12px;}</STYLE>");
targetwin.document.write("</HEAD><BODY leftmargin=\"0\" topmargin=\"0\" marginwidth=\"0\" marginheight=\"0\">");
// targetwin.document.write("<table width=\"180\" border=\"0\" cellspacing=\"0\" cellpadding=\"0\" align=\"center\"><tr><td>");
targetwin.document.write("<table class=headerTable border=\"0\" cellspacing=\"0\" cellpadding=\"0\"><td class=listTD align=\"center\">");
targetwin.document.write("<TABLE align=\"center\"><TR VALIGN=TOP><FORM>");

var prevyear = eval(year) - 1;
targetwin.document.write("<TD valign=\"middle\"><INPUT TYPE=BUTTON NAME=prevyearbutton VALUE=´<<´"+
" onclick=´document.close();opener.calccal(opener.calwin,"+month+","+prevyear+",\""+targetfield+"\")´></TD>");
var prevmonth = calcprevmonth(month);
var prevmonthyear = calcprevyear(month,year);
targetwin.document.write("<TD valign=\"middle\"><INPUT TYPE=BUTTON NAME=prevmonthbutton VALUE=´ < ´"+
" onclick=´document.close();opener.calccal(opener.calwin,"+prevmonth+","+prevmonthyear+",\""+targetfield+"\")´></TD>");
targetwin.document.write("<TD COLSPAN=3 ALIGN=CENTER ALIGN=CENTER valign=\"middle\">");
var index = eval(month) - 1;
targetwin.document.write("<B>" + monthname[index] + "<BR> " + year + "</B></TD>");
var nextmonth = calcnextmonth(month);
var nextmonthyear = calcnextyear(month,year);
targetwin.document.write("<TD valign=\"middle\"><INPUT TYPE=BUTTON NAME=nextmonthbutton VALUE=´ > ´"+
" onclick=´document.close();opener.calccal(opener.calwin,"+nextmonth+","+nextmonthyear+",\""+targetfield+"\")´></TD>");
var nextyear = eval(year) + 1;
targetwin.document.write("<TD valign=\"middle\"><INPUT TYPE=BUTTON NAME=nextyearbutton VALUE=´>>´"+
" onclick=´document.close();opener.calccal(opener.calwin,"+month+","+nextyear+",\""+targetfield+"\")´></TD>");
targetwin.document.write("</TR><TR>");
targetwin.document.write("<TD><b>日</b></TD>");
targetwin.document.write("<TD><b>一</b></TD>");
targetwin.document.write("<TD><b>二</b></TD>");
targetwin.document.write("<TD><b>三</b></TD>");
targetwin.document.write("<TD><b>四</b></TD>");
targetwin.document.write("<TD><b>五</b></TD>");
targetwin.document.write("<TD><b>六</b></TD>");
targetwin.document.write("</TR>");
targetwin.document.write("<TR><TD COLSPAN=7><HR NOSHADE size=\"1\" color=\"blue\"></TD></TR>");
var selectedmonth = eval(month) - 1;
var today = new Date();
var thisyear = today.getYear();
var selectedyear = eval(year) - thisyear + 4;
var conditionalpadder = "";
var tmpyear = "";
var tmpmonth = "";
var tmpday = "";

for(r=0; r<6; r++)
{
targetwin.document.write("<TR>");
for(c=0; c<7; c++)
{
targetwin.document.write("<TD>");
if(day[r][c] != null) {
if (day[r][c] < 10)
conditionalpadder = " "
else
conditionalpadder = "";

tmpyear = yearA[selectedyear.toString()];
tmpmonth = (selectedmonth+1).toString();
tmpday = (day[r][c]).toString();
if (tmpmonth.length == 1) tmpmonth = "0"+tmpmonth;
if (tmpday.length == 1) tmpday = "0"+tmpday;
targetwin.document.write("<INPUT TYPE=BUTTON NAME="+day[r][c]+
" VALUE=" + conditionalpadder + day[r][c] + conditionalpadder +
" onClick=\"window.close();" +targetfield+"=´"+tmpyear+tmpmonth+tmpday+"´;\";>");
}
targetwin.document.write("</TD>");
}
targetwin.document.write("</TR>");
}
targetwin.document.write("</FORM></TABLE>");
targetwin.document.write("<br><br></td></tr></table></td></tr></table></BODY></HTML>");
}
function calclastday(month,year) {
if ((month==2) && ((year%4)==0))
return 29;
if ((month==2) && ((year%4)!=0))
return 28;
if ((month==1) || (month == 3) || (month == 5) || (month == 7) ||
(month==8) || (month == 10) || (month ==12))
return 31;
return 30;
}
function calcnextmonth(month) {
if (month=="12")
return "1";
else
return (eval(month)+1);
}
function calcnextyear(month,year) {
if (month=="12")
return (eval(year)+1);
else
return (year);
}
function calcprevmonth(month) {
if (month=="1")
return "12";
else
return (eval(month)-1);
}
function calcprevyear(month,year) {
if (month=="1")
return (eval(year)-1);
else
return (year);
}
//以上代码命名为calendar.js放在webapps目录下的javascript的资料夹中,在页面的<head>之间添加<script language="JavaScript" SRC="javascript/calendar.js">
</script>
格式如下例: <input name="material_date" type="text" size="8" value="<%=material_date%>">
<img src="my_image/getdate.gif" width="16" height="15" onClick="opencalendar(´material_date´)">
posted on 2006-04-06 21:25  Ecoboy  阅读(631)  评论(0)    收藏  举报