热点排行

ASP+JavaScript的完整的日历使用

类别：Asp 点击：0 评论：0 推荐：

第一步：保存下列文件为:CALENDAR.ASP

<%@ LANGUAGE = VBScript %>
<% Option Explicit %>
<%
Function sFont(iSize,sFace,sColor,bScale)
 Dim sOutputStr
 sOutputStr = "<FONT"
 if sFace <> "" then
   sOutputStr = sOutputStr & " FACE='" & sFace & "'"
 else
   sOutputStr = sOutputStr & " FACE='Helv'"
 end if

 if iSize = "" then
  iSize = 1
 end if
 if bScale then
  iSize = cInt(iSize * 1)
 end if
 sOutputStr = sOutputStr & " SIZE=" & iSize
 if sColor <> "" then
   sOutputStr = sOutputStr & " COLOR=" & sColor
 end if
 
 sOutputStr = sOutputStr & ">"

 sFont = sOutputStr
End Function
On Error Resume Next
Dim datecntrl, Dy, Mo, Yr, nextmonth, startwith, thisMo, thisYr, thisDate,the_type
Dim prevMonthLastDate, currMonthLastDate, i, j, lastnum, AnyDate,default_value

datecntrl= Request("object")
default_value=request("value")
the_type=request("type")
if the_type<>"datetime" then
 the_type="date"
end if

if default_value="" then
 Yr = year(date)
 Mo = month(date)
 Dy = day(date)
else
    dim pos1
    dim deal_value
    deal_value=default_value
    pos1=instr(deal_value,"-")
 Yr = cint(mid(deal_value,1,pos1-1))
 deal_value=mid(deal_value,pos1+1)
 pos1=instr(deal_value,"-")
 Mo = cint(mid(deal_value,1,pos1-1))
 if trim(the_type)="date" then
  Dy = cint(mid(deal_value,pos1+1))
 else
     dim H,M,S
  deal_value=mid(deal_value,pos1+1)
  pos1=instr(deal_value," ")
     Dy=cint(mid(deal_value,1,pos1-1))
  deal_value=mid(deal_value,pos1+1)
  pos1=instr(deal_value,":")
     H=cint(mid(deal_value,1,pos1-1))
  deal_value=mid(deal_value,pos1+1)
  pos1=instr(deal_value,":")
     M=cint(mid(deal_value,1,pos1-1))
    S=cint(mid(deal_value,pos1+1))
 end if 
end if

nextmonth = false
%>
<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">
  <style type="text/css">
 A
  { FONT-SIZE: 13px; COLOR: #000000;TEXT-DECORATION: none }
 A:hover
 {COLOR: #ff0000;
 }
  </style>
  <TITLE>日历</TITLE>
  <SCRIPT LANGUAGE="JavaScript">
 //检查字符串是否为日期，返回值：false、true
function f_chkDate(datestr)
{
 var lthdatestr
 if (datestr != "")
  lthdatestr= datestr.length ;
 else
  lthdatestr=0;
  
 var tmpy="";
 var tmpm="";
 var tmpd="";
 //var datestr;
 var status;
 status=0;
 if ( lthdatestr== 0)
  return false;

    if(lthdatestr>10)
       return false;
 
 for (i=0;i < lthdatestr;i++)
 { if (datestr.charAt(i)== '-')
  {
   status++;
  }
  if (status>2)
  {
   //alert("Invalid format of date!");
   return false;
  }
  if ((status==0) && (datestr.charAt(i)!='-'))
  {
   tmpy=tmpy+datestr.charAt(i)
  }
  if ((status==1) && (datestr.charAt(i)!='-'))
  {
   tmpm=tmpm+datestr.charAt(i)
  }
  if ((status==2) && (datestr.charAt(i)!='-'))
  {
   tmpd=tmpd+datestr.charAt(i)
  }

 }
 year=new String (tmpy);
 month=new String (tmpm);
 day=new String (tmpd);
 
 //tempdate= new String (year+month+day);
 //alert(tempdate);
 if ((tmpy.length!=4) || (tmpm.length>2) || (tmpd.length>2))
 {
  //alert("Invalid format of date!");
  return false;
 }
 if (!((1<=month) && (12>=month) && (31>=day) && (1<=day)) )
 {
     //alert ("Invalid month or day!");
  return false;
 }
 if (!((year % 4)==0) && (month==2) && (day==29))
 {
  //alert ("This is not a leap year!");
  return false;
 }
 if ((month<=7) && ((month % 2)==0) && (day>=31))
 {
  //alert ("This month is a small month!");
  return false;
 
 }
 if ((month>=8) && ((month % 2)==1) && (day>=31))
 {
  //alert ("This month is a small month!");
  return false;
 }
 if ((month==2) && (day==30))
 {
  //alert("The Febryary never has this day!");
  return false;
 }
 
 return true;
}


  function right(str,number)
  {
   return str.substr(str.length - number,str.length);
  }
  function setDate(Dy,Mo,Yr,vBool)
  { 
            if (vBool)
               {
               if (Mo<10)  Mo="0"+Mo;
               if (Dy<10)  Dy="0"+Dy;
   
   <%if the_type="datetime" then%>
    top.opener.<%= datecntrl %>.value =Yr+"-"+Mo+"-"+Dy+" "+userform.hour.value+":"+userform.minute.value+":"+userform.second.value;
   <%else%>
    top.opener.<%= datecntrl %>.value =Yr+"-"+Mo+"-"+Dy;
   <%end if%>
   top.window.close();
              
               }
  
      <%if the_type="datetime" then%>
       self.location.href="calendar.asp?type=<%=the_type%>&object=<%= datecntrl %>&value="+Yr+"-"+right(("0"+Mo),2)+"-"+right(("0"+Dy),2)+" "+userform.hour.value+":"+userform.minute.value+":"+userform.second.value;
   <%else%>
    self.location.href="calendar.asp?type=<%=the_type%>&object=<%= datecntrl %>&value="+Yr+"-"+right(("0"+Mo),2)+"-"+right(("0"+Dy),2);
   <%end if%>
  }
  
  function saveDate()
  {
   <%if the_type="datetime" then%>
    top.opener.<%= datecntrl %>.value ="<%= Yr & "-" & right("0"+cstr(Mo),2) & "-" & right("0"+cstr(Dy),2) %>"+" "+userform.hour.value+":"+userform.minute.value+":"+userform.second.value;
   <%else%>
    top.opener.<%= datecntrl %>.value ="<%= Yr & "-" & right("0"+cstr(Mo),2) & "-" & right("0"+cstr(Dy),2) %>";
   <%end if%>
   top.window.close();
  }
  
  </SCRIPT>
 </HEAD>
 <BODY onload="javascript:window.focus()" bgcolor="#CCFFFF">
  <FORM NAME="userform">
   <TABLE WIDTH="100%" CELLPADDING="2" CELLSPACING="0">
    <TR>
     <TD ALIGN="left">
      <%= sFont("2","宋体","",True) %>
      <%= writeYears(Yr) %>
     </TD>
     <TD ALIGN="right">
      <%= sFont("2","宋体","",True) %>
      <%= writeMonths(Mo) %>
     </TD>
    </TR>
   </TABLE>
   <TABLE WIDTH="100%" BORDER="1" BORDERCOLOR="Silver" CELLPADDING="2" CELLSPACING="0">
    <%

 function nextDate(startwith, maxdays)
  startwith = startwith + 1
  if startwith > maxdays then
   startwith = 1
  end if
  
  nextDate = startwith
 end function
 
 function GetLastDay(Mo,Yr)
    if Mo=2 then
   if (Yr Mod 4)=0 then
       GetLastDay = 29
   else
    GetLastDay = 28
   end if
  elseif ((Mo = 0) OR (Mo = 1) OR (Mo = 3) OR (Mo = 5) OR (Mo = 7) OR (Mo = 8) OR (Mo = 10) OR (Mo = 12)) then
      GetLastDay =  31
  else
      GetLastDay =  30
  end if
   end function
 
 function GetFirstDayOffset(Mo,Yr)
  GetFirstDayOffset = weekday(Mo & "/01/" & Yr)-1
   end function
 
 function writeMonths(selMo)
  dim i, selstr
  selstr = "<SELECT NAME='Months' onChange='setDate(" & Dy & ",this.selectedIndex+1," & Yr & ",false);'>"
  for i=1 to 12
   if selMo = i then
    selstr = selstr & "<OPTION SELECTED>" & MonthName(i)   
   else
    selstr = selstr & "<OPTION>" & MonthName(i)
   end if
  next                
  selstr = selstr & "</SELECT>"
  writeMonths = selstr
 end function
 
 function writeYears(selYear)
  dim i, selstr
  selstr = "<SELECT NAME='Years' onChange='setDate(" & Dy & "," & Mo & ",this.options[this.selectedIndex].value,false);'>"
  for i=1900 to 2100
   if selYear = i then
    selstr = selstr & "<OPTION SELECTED VALUE=" & i & ">" & i & "年"   
   else
    selstr = selstr & "<OPTION VALUE=" & i & ">" & i & "年"
   end if
  next                
  selstr = selstr & "</SELECT>"
  writeYears = selstr  
 end function

 prevMonthLastDate=GetLastDay((Mo-1),Yr)  
 currMonthLastDate=GetLastDay(Mo,Yr) 
 startwith=(prevMonthLastDate-GetFirstDayOffset(Mo, Yr))

%>
    <TR>
     <TD WIDTH="20" HEIGHT="20" BGCOLOR="Gray" BORDERCOLOR="Silver" BORDERCOLORDARK="#FFFFFF" BORDERCOLORLIGHT="#000000">
      <%= sFont("2","宋体","#FFFFFF",True) %>
      <B>日</B>
     </TD>
     <TD WIDTH="20" HEIGHT="20" BGCOLOR="Gray" BORDERCOLOR="Silver" BORDERCOLORDARK="#FFFFFF" BORDERCOLORLIGHT="#000000">
      <%= sFont("2","宋体","#FFFFFF",True) %>
      <B>一</B>
     </TD>
     <TD WIDTH="20" HEIGHT="20" BGCOLOR="Gray" BORDERCOLOR="Silver" BORDERCOLORDARK="#FFFFFF" BORDERCOLORLIGHT="#000000">
      <%= sFont("2","宋体","#FFFFFF",True) %>
      <B>二</B>
     </TD>
     <TD WIDTH="20" HEIGHT="20" BGCOLOR="Gray" BORDERCOLOR="Silver" BORDERCOLORDARK="#FFFFFF" BORDERCOLORLIGHT="#000000">
      <%= sFont("2","宋体","#FFFFFF",True) %>
      <B>三</B>
     </TD>
     <TD WIDTH="20" HEIGHT="20" BGCOLOR="Gray" BORDERCOLOR="Silver" BORDERCOLORDARK="#FFFFFF" BORDERCOLORLIGHT="#000000">
      <%= sFont("2","宋体","#FFFFFF",True) %>
      <B>四</B>
     </TD>
     <TD WIDTH="20" HEIGHT="20" BGCOLOR="Gray" BORDERCOLOR="Silver" BORDERCOLORDARK="#FFFFFF" BORDERCOLORLIGHT="#000000">
      <%= sFont("2","宋体","#FFFFFF",True) %>
      <B>五</B>
     </TD>
     <TD WIDTH="20" HEIGHT="20" BGCOLOR="Gray" BORDERCOLOR="Silver" BORDERCOLORDARK="#FFFFFF" BORDERCOLORLIGHT="#000000" style="font-family: Helv,Arial; font-size: 10pt;">
      <%= sFont("2","宋体","#FFFFFF",True) %>
      <B>六</B>
     </TD>
    </TR>
    <% For j = 1 to 6 %>
    <TR>
     <% For i = 1 to 7 %>
     <% if j = 1 then %>
     <% startwith = nextDate(startwith, prevMonthLastDate) %>
     <% if startwith = Dy and startwith < 7 then %>
     <TD WIDTH="20" HEIGHT="20" BGCOLOR="#AAAAAA" BORDERCOLOR="#AAAAAA" BORDERCOLORDARK="#FFFFFF" BORDERCOLORLIGHT="#AAAAAA">
      <% else %>
     <TD WIDTH="20" HEIGHT="20" BORDERCOLOR="Silver" BORDERCOLORDARK="#FFFFFF" BORDERCOLORLIGHT="#000000">
      <% end if %>
      <% thisYr = Yr %>
      <%= sFont("2","宋体","",True) %>
      <% if startwith < 7 then %>
      <B>
       <% thisMo = Mo %>
       <% else %>
       <% thisMo = Mo - 1 %>
       <% if thisMo = 0 then %>
       <% thisMo = 12 %>
       <% thisYr = Yr-1 %>
       <% end if %>
       <% end if %>
       <A HREF="javascript:setDate( <%= startwith %>, <%= thisMo %>,<%= thisYr %>,false);" >
        <% response.write startwith %>
       </A></B>
     </TD>
     <% else %>
     <% lastnum = startwith %>
     <% startwith = nextDate(startwith, currMonthLastDate) %>
     <% if lastnum > startwith then%>
     <% nextmonth = true %>
     <% end if %>
     <% if startwith = Dy and not nextmonth then %>
     <TD WIDTH="20" HEIGHT="20" BGCOLOR="#AAAAAA" BORDERCOLOR="#AAAAAA" BORDERCOLORDARK="#AAAAAA" BORDERCOLORLIGHT="#FFFFFF">
      <% else %>
     <TD WIDTH="20" HEIGHT="20" BORDERCOLOR="Silver" BORDERCOLORDARK="#FFFFFF" BORDERCOLORLIGHT="#000000">
      <% end if %>
      <% thisYr = Yr %>
      <% if not nextmonth then %>
      <B>
       <% thisMo = Mo %>
       <% else %>
       <% thisMo = Mo + 1 %>
       <% if thisMo = 13 then %>
       <% thisMo = 1 %>
       <% thisYr = Yr+1 %>
       <% end if %>
       <% end if %>
       <%= sFont("2","宋体","",True) %>
       <A HREF="javascript:setDate(<%= startwith %>, <%= thisMo %>, <%= thisYr %>,false);" >
        <% response.write startwith %>
       </A></B>
     </TD>
     <% end if %>
     <% Next %>
    </TR>
    <% Next %>
   </TABLE>
   <table>
    <tr>
     <td>
      <%if the_type="datetime" then%>
      <select size="1" name="hour">
       <%
  for i=0 to 23
    if (i=H) then
       response.write "<option selected value='"+right("0"+cstr(i),2)+"'>"+right("0"+cstr(i),2)+"时"+"</option>"
    else
       response.write "<option value='"+right("0"+cstr(i),2)+"'>"+right("0"+cstr(i),2)+"时"+"</option>"
    end if
  next
  %>
      </select>
      <select size="1" name="minute">
       <%
  for i=0 to 59
    if (i=M) then
       response.write "<option selected value='"+right("0"+cstr(i),2)+"'>"+right("0"+cstr(i),2)+"分"+"</option>"
    else  
       response.write "<option value='"+right("0"+cstr(i),2)+"'>"+right("0"+cstr(i),2)+"分"+"</option>"
    end if  
  next
  %>
      </select>
      <select size="1" name="second">
       <%
  for i=0 to 59
    if (i=S) then
       response.write "<option selected value='"+right("0"+cstr(i),2)+"'>"+right("0"+cstr(i),2)+"秒"+"</option>"
    else
       response.write "<option value='"+right("0"+cstr(i),2)+"'>"+right("0"+cstr(i),2)+"秒"+"</option>"
    end if      
  next
  %>
      </select>
      <%end if%>
     </td>
    </tr>
   </table>
   <CENTER>
    <INPUT TYPE="button" id="ok" VALUE=" 确定 " onClick="saveDate();">&nbsp;&nbsp; <INPUT TYPE="button" VALUE=" 取消 " onClick="top.window.close();">
   </CENTER>
  </FORM>
  <script language="javascript">
var strDate = <%=Yr%>+"-"+right(("0"+<%=Mo%>),2)+"-"+right(("0"+<%=Dy%>),2);
if (f_chkDate(strDate))
 document.all.ok.disabled = false;
else
 document.all.ok.disabled = true;
  </script>
 </BODY>
</HTML>

 

第二步:保存下列文件为:JavaScriptdate.js


function f_get_date(object_name){
 var object_value="";
 eval("object_value="+object_name+".value");
if(!f_chkDate(object_value)){
  var v_today=new Date();
  object_value=v_today.getYear()+"-"+(v_today.getMonth()+1)+"-"+(v_today.getDate());
 }
open('calendar.asp?type=date&object='+object_name+'&value='+object_value,'calendar','resizable=yes,toolbar=no,scrollbars=no,directories=no,menubar=no,width=180,height=240');
}
//获取日历时间函数
function f_get_datetime(object_name){
 var object_value="";
 eval("object_value="+object_name+".value");
 open('calendar.asp?type=datetime&object='+object_name+'&value='+object_value,'calendar','resizable=yes,toolbar=no,scrollbars=no,directories=no,menubar=no,width=210,height=270');
}


//检查字符串是否为日期，返回值：false、true
function f_chkDate(datestr)
{
 var lthdatestr
 if (datestr != "")
  lthdatestr= datestr.length ;
 else
  lthdatestr=0;
  
 var tmpy="";
 var tmpm="";
 var tmpd="";
 //var datestr;
 var status;
 status=0;
 if ( lthdatestr== 0)
  return false;

    if(lthdatestr>10)
       return false;
 
 for (i=0;i < lthdatestr;i++)
 { if (datestr.charAt(i)== '-')
  {
   status++;
  }
  if (status>2)
  {
   //alert("Invalid format of date!");
   return false;
  }
  if ((status==0) && (datestr.charAt(i)!='-'))
  {
   tmpy=tmpy+datestr.charAt(i)
  }
  if ((status==1) && (datestr.charAt(i)!='-'))
  {
   tmpm=tmpm+datestr.charAt(i)
  }
  if ((status==2) && (datestr.charAt(i)!='-'))
  {
   tmpd=tmpd+datestr.charAt(i)
  }

 }
 year=new String (tmpy);
 month=new String (tmpm);
 day=new String (tmpd);
 
 //tempdate= new String (year+month+day);
 //alert(tempdate);
 if ((tmpy.length!=4) || (tmpm.length>2) || (tmpd.length>2))
 {
  //alert("Invalid format of date!");
  return false;
 }
 if (!((1<=month) && (12>=month) && (31>=day) && (1<=day)) )
 {
     //alert ("Invalid month or day!");
  return false;
 }
 if (!((year % 4)==0) && (month==2) && (day==29))
 {
  //alert ("This is not a leap year!");
  return false;
 }
 if ((month<=7) && ((month % 2)==0) && (day>=31))
 {
  //alert ("This month is a small month!");
  return false;
 
 }
 if ((month>=8) && ((month % 2)==1) && (day>=31))
 {
  //alert ("This month is a small month!");
  return false;
 }
 if ((month==2) && (day==30))
 {
  //alert("The Febryary never has this day!");
  return false;
 }
 
 return true;
}


第三步:在页中加入如下示例:(使用页)

        <script language="javascript" src="JavaScriptdate.js"></script>

        <input class="input" style="cursor:hand"; name="myTime" type="text" id="myTime" size="16" value="" readonly="true">

    1.获取日期:
        <script language="javascript" event="onclick" for="myTime">
                f_get_date("document.all.myTime");
        </script>
       
     2.获取日期和时间
         <script language="javascript" event="onclick" for="myTime">
                f_get_datetime("document.all.myTime");
         </script>

本文地址：http://com.8s8s.com/it/it8577.htm

Copyright © 2004-2013 信息技术中文网 All rights reserved 版权所有

Powered by 信息技术中文网 Ver2.0