急！javascript

谁有用javascript 写的日历代码,就像http://www.ctrip.com/那样

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

网上太多了
http://down.vipcn.com/InfoView/Article_76943.html
http://www.seobbs.net/read.php?tid=513&fpage=21
test.htm内容：<script language="JavaScript" src="date_pop.js"></script>
<input name="tim" type="text" class=textbox id="baoz" size="30" readonly value="">
<input type="button" value="点击选择日期" name="selectDate" onClick="fPopUpCalendarDlg(tim)" >date_pop.js内容：var gcToggle = "#ffff00";
var gcBG = "#CCCCFF";function IOFFICE_GetSelected(aCell)
{  window.returnValue = aCell.innerText;
window.close();

}function fPopUpCalendarDlg(ctrlobj)
{
showx = event.screenX -120  ; // + deltaX;- event.offsetX - 4 - 210
showy = event.screenY + 12; // + deltaY;- event.offsetY + 18
newWINwidth = 210 + 4 + 18;retval = window.showModalDialog("calendar.htm", "", "dialogWidth:310px; dialogHeight:227px; dialogLeft:"+showx+"px; dialogTop:"+showy+"px; status:no; directories:yes;scrollbars:no;Resizable=no; "  );
if( retval != null ){
ctrlobj.value = retval;
}else{
//alert("canceled");
}
}calendar.htm内容：<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>日期选择</title>
<link href="main.css" rel="stylesheet" type="text/css">
<script language="JavaScript" src="calendarOperation.js"></script>
</head><body onLoad="initializeCalendarDiv();">
<table id="Calendar" cellspacing="0" cellpadding="2" rules="all" bordercolor="#FFCC66" border="1" style="color: #663399; background-color: #FFFFCC; font-family: Verdana; font-size: 8pt; width: 290px; border-collapse: collapse; z-index: 102; left:0; position: absolute; top:0; border: 1px solid #FFCC66" width="187" height="202">
<input type="hidden" name="aimInput" value="">
<input type="hidden" name="HiddenCurrentYear" value="">
<input type="hidden" name="HiddenCurrentMonth" value="">
<input type="hidden" name="HiddenCurrentDay" value="">
<tr>
<td colspan="7" style="background-color:#990000;">
   <input type="hidden" name="CurrentDay" value="">
   <table cellspacing="0" border="0" style="color:#FFFFCC;font-family:Verdana;font-size:9pt;font-weight:bold;width:100%;border-collapse:collapse;">
<tr>
   <td style="color:#FFFFCC;font-size:9pt;width:15%;"><input type="button" value="<" onClick="changeMonth('decrease')"></td>
   <td align="Center" style="width:70%;">
     <select id="SelectYear" style="visibility:hidden" onChange="ChangeSelectYear()">
     </select>
     <input type="text" name="CurrentYear" size="4" onFocus="disSelectYear()" readonly class="tx">年<input type="text" name="CurrentMonth" value="" size="2" readonly class="tx">月
   </td>
   <td align="Right" style="color:#FFFFCC;font-size:9pt;width:15%;">
      <input type="button" value=">" onClick="changeMonth('increase')">
   </td>
</tr>
   </table>
</td>
</tr>
<tr>
   <td align="Center" style="background-color:#FFCC66;height:1px;">星期日</td>
   <td align="Center" style="background-color:#FFCC66;height:1px;">星期一</td>
   <td align="Center" style="background-color:#FFCC66;height:1px;">星期二</td>
   <td align="Center" style="background-color:#FFCC66;height:1px;">星期三</td>
   <td align="Center" style="background-color:#FFCC66;height:1px;">星期四</td>
   <td align="Center" style="background-color:#FFCC66;height:1px;">星期五</td>
   <td align="Center" style="background-color:#FFCC66;height:1px;">星期六</td>
</tr>
<tr>
  <td align="Center" id="day1"></td>
  <td align="Center" id="day2"></td>
  <td align="Center" id="day3"></td>
  <td align="Center" id="day4"></td>
  <td align="Center" id="day5" style="width:14%;"></td>
  <td align="Center" id="day6" style="width:14%;"></td>
  <td align="Center" id="day7" style="width:14%;"></td>
</tr>
<tr>
  <td align="Center" id="day8" style="width:14%;"></td>
  <td align="Center" id="day9" style="width:14%;"></td>
  <td align="Center" id="day10" style="width:14%;"></td>
  <td align="Center" id="day11" style="width:14%;"></td>
  <td align="Center" id="day12" style="width:14%;"></td>
  <td align="Center" id="day13" style="width:14%;"></td>
  <td align="Center" id="day14" style="width:14%;"></td>
</tr>
<tr>
  <td align="Center" id="day15" style="width:14%;"></td>
  <td align="Center" id="day16" style="width:14%;"></td>
  <td align="Center" id="day17" style="width:14%;"></td>
  <td align="Center" id="day18" style="width:14%;"></td>
  <td align="Center" id="day19" style="width:14%;"></td>
  <td align="Center" id="day20" style="width:14%;"></td>
  <td align="Center" id="day21" style="width:14%;"></td>
</tr>
<tr>
  <td align="Center" id="day22" style="width:14%;"></td>
  <td align="Center" id="day23" style="width:14%;"></td>
  <td align="Center" id="day24" style="width:14%;"></td>
  <td align="Center" id="day25" style="width:14%;"></td>
  <td align="Center" id="day26" style="width:14%;"></td>
  <td align="Center" id="day27" style="width:14%;"></td>
  <td align="Center" id="day28" style="width:14%;"></td>
</tr>
<tr>
  <td align="Center" id="day29" style="width:14%;"></td>
  <td align="Center" id="day30" style="width:14%;"></td>
  <td align="Center" id="day31" style="width:14%;"></td>
  <td align="Center" id="day32" style="width:14%;"></td>
  <td align="Center" id="day33" style="width:14%;"></td>
  <td align="Center" id="day34" style="width:14%;"></td>
  <td align="Center" id="day35" style="width:14%;"></td>
</tr>
<tr>
  <td align="Center" id="day36" style="width:14%;"></td>
  <td align="Center" id="day37" style="width:14%;"></td>
  <td align="Center" id="day38" style="width:14%;"></td>
  <td align="Center" id="day39" style="width:14%;"></td>
  <td align="Center" id="day40" style="width:14%;"></td>
  <td align="Center" id="day41" style="width:14%;"></td>
  <td align="Center" id="day42" style="width:14%;"></td>
</tr>
<tr>
  <td colspan="6" style="background-color:#FFCC66;height:1px;"> </td>
  <td align="Center" style="background-color:#FFCC66;height:1px;"><div id="cancel" style="cursor:hand"onClick="SetEmpty()">清空</div></td>
</tr>
</table></body></html>
calendarOperation.js内容：function initializeCalendarDiv()
  {
    //firstCalendarLoad();
    var objectCal=document.all["Calendar"];
    //objectCal.style.visibility="hidden";
    //dispCalendar()
    objectCal.style.visibility="visible";
    firstCalendarLoad();
  }
function dispCalendar()
{
   var calendarWidth=parseInt(document.all["Calendar"].style.width);
   var l_ScreenWidth=document.body.clientWidth;
   var x =document.body.scrollLeft+event.clientX;
   if (( x+calendarWidth)>l_ScreenWidth && event.clientX>=calendarWidth)
   {
     x=x-calendarWidth;
   }
   if (( x+calendarWidth)>l_ScreenWidth && event.clientX<=calendarWidth)
   {
     x=0;
   }
   var y=document.body.scrollTop+event.clientY+7;
   //document.all["aimInput"].value=aimInput;
   var objectCal=document.all["Calendar"];
   objectCal.style.top=y;
   objectCal.style.left=x;
   objectCal.style.visibility="visible";
   firstCalendarLoad();
}
function firstCalendarLoad()
{
  var oneDate=new Date();
  document.all("HiddenCurrentYear").value=oneDate.getYear();
  document.all("hiddenCurrentMonth").value=oneDate.getMonth()+1;
  document.all("CurrentYear").value=oneDate.getYear();
  document.all("CurrentMonth").value=oneDate.getMonth()+1;
  document.all("HiddenCurrentDay").value=oneDate.getDate();
  document.all("CurrentDay").value=oneDate.getDate();
  produceAllDays(oneDate.getYear(),oneDate.getMonth())
  initializeSelectYearOption()
}
function loadCalendar()
{
   document.all("CurrentYear").value=document.all("HiddenCurrentYear").value;
   document.all("CurrentMonth").value=document.all("HiddenCurrentMonth").value;
}
function changeMonth(mode)
{
   var localCurrentYear,localCurrentMonth;
   localCurrentYear=parseInt(document.all("HiddenCurrentYear").value);
   localCurrentMonth=parseInt(document.all("HiddenCurrentMonth").value);
   if (mode=="decrease")
   {
     //localCurrentYear=localCurrentYear-1;
     if (localCurrentMonth==1)
     {
       localCurrentMonth=12;
       localCurrentYear=localCurrentYear-1;
     }
     else
     {
       localCurrentMonth=localCurrentMonth-1;
     }
   }
   else
   {
    if (localCurrentMonth==12)
     {
       localCurrentMonth=1;
       localCurrentYear=localCurrentYear+1;
     }
     else
     {
       localCurrentMonth=localCurrentMonth+1;
     }   }
   document.all("HiddenCurrentYear").value=localCurrentYear
   document.all("HiddenCurrentMonth").value=localCurrentMonth
   loadCalendar();
   produceAllDays(localCurrentYear,localCurrentMonth-1);
}
function produceAllDays(newYear,newMonth)
{
   var newDay="1";
   var retDay;
   var arrList=new Array(42);
   for (var i=1;i<=42;i++)
   {
    arrList[i]=" ";
   }
   var oneDate=new Date(newYear,newMonth,newDay);
   retDay=DaysOfMonth(newYear,newMonth);
   var FirstDateDay=oneDate.getDay()+1;
   var LastDateDay=FirstDateDay+retDay-1;
   var count=1
   for (var j=1;j<FirstDateDay;j++)
   {
     var whichCell="day"+j;
     document.all[whichCell].innerHTML=arrList[j];
   }
   if (LastDateDay<42)
   {
      for (var j=(LastDateDay+1);j<=42;j++)
      {
        var whichCell="day"+j;
        document.all[whichCell].innerHTML=arrList[j];
      }
   }
   for (j=FirstDateDay;j<=LastDateDay;j++)
   {
     var whichCell="day"+j;
     arrList[j]=count.toString();
     document.all[whichCell].innerHTML="<div id='lday"+j+"' style='cursor:hand' onClick=selectDate('"+arrList[j]+"')>"+arrList[j]+"</div>";
     count=count+1;
   }
}
function DaysOfMonth(newYear,newMonth)
{
   newMonth=newMonth+1
   if (newMonth=="1" || newMonth=="3" || newMonth=="5" || newMonth=="7" || newMonth=="8" || newMonth=="10" || newMonth=="12")
   {
     return 31
   }
   else
   {
    if (newMonth=="2")
     {
       if ((newYear%4==0 && newYear%100!=0) || newYear%400==0)
         return 29;
        else
         return 28;
     }
     else
     {
      return 30;
     }
   }
}
function selectDate(newDay)
{
   //var oneDate=new Date(document.all["HiddenCurrentYear"].value,document.all["HiddenCurrentMonth"].value-1,"1")
   //var firstDay=oneDate.getDay();
   //alert(oneDate);
   //newDay=parseInt(newDay)-firstDay;
   //alert(newDay);
   //var strAimInput=document.all["aimInput"].value;
   //var objectCal=document.all["Calendar"];
   //document.all[strAimInput].value=document.all["CurrentYear"].value+"-"+document.all["CurrentMonth"].value+"-"+newDay
   //document.all["aimInput"].value="";
   //objectCal.style.visibility="hidden";
   //document.all["calendar"].
   //window.returnValue=document.all["CurrentYear"].value+"-"+document.all["CurrentMonth"].value+"-"+newDay;

   window.returnValue=document.all["CurrentYear"].value+"-"+document.all["CurrentMonth"].value+"-"+newDay;
   window.close();
}
function SetEmpty()
{
   window.returnValue="";
   window.close();
}

function disSelectYear()
{
   var objSelectYear=document.all["SelectYear"];
   if (objSelectYear.style.visibility=="visible")
   {
     objSelectYear.style.visibility="hidden"
   }
   else
   {
     objSelectYear.style.visibility="visible"
   }
   for (var i=0;i<document.all["SelectYear"].options.length-1;i++)
   {
     var inputCurrentYear=document.all["CurrentYear"].value;
     var objSelectYear=document.all["SelectYear"];
     if (objSelectYear.options[i].value==inputCurrentYear)
     {
       objSelectYear.selectedIndex=i;
     }
   }
}

function initializeSelectYearOption()
{
   var objSelectYear=document.all["SelectYear"];
   var nowDate=new Date();
   var nowYear=nowDate.getYear();
   for (var j=(nowYear+10);j>=1900;j--)
   {
     //objSelectYear.options[j-1900].value=j;
     //var op = new option('test','12');
     var oOption=document.createElement("OPTION");
oOption.value=j;
     oOption.text=j;
     objSelectYear.add(oOption);
   }
}

function ChangeSelectYear()
{
   var CurrentSelectYear=document.all["SelectYear"].options[document.all["SelectYear"].selectedIndex].value;
   document.all["HiddenCurrentYear"].value=CurrentSelectYear;
   document.all["CurrentYear"].value=CurrentSelectYear;
   produceAllDays(CurrentSelectYear,document.all["HiddenCurrentMonth"].value-1);
   document.all["SelectYear"].style.visibility="hidden";
}
function fkeydown()
{
if(event.keyCode==27){
event.returnValue = null;
window.returnValue = null;
window.close();
}
}document.onkeydown=fkeydown;
四个文件test.htm、date_pop.js、calendar.htm、calendarOperation.js保存在同一个文件夹下我用IE打开就行，放opera就是不行