萬年曆(頁 1) - javascript、html 語法教學 - 日期 / 時間類別 - 笨笨網站超級論壇

#1 萬年曆 - 蛙 (Administrator) 發表於 18-5-2012 17:57

<P><FONT color=blue><FONT color=#0000ff size=3>如不能顯示語法效果可貼去本站</FONT><A href="http://www.bunbun000.com/html/index.htm" target=_blank><FONT color=red size=3>語法測試板</FONT></A><FONT color=#0000ff size=3>試看</FONT></P>
<P><FONT size=3></FONT> </P>
<P><FONT size=3></FONT> </P>
<P><FONT size=3></FONT> </P></FONT>
<P><FONT color=blue></FONT> </P>
<P><FONT color=blue></FONT> </P>
<P><FONT color=blue><script language="JavaScript"><BR><!-- for sucky browsers</FONT></P>
<P><FONT color=blue>Months = new Array(12);<BR>Months[0] = "一月";<BR>Months[1] = "二月";<BR>Months[2] = "三月";<BR>Months[3] = "四月";<BR>Months[4] = "五月";<BR>Months[5] = "六月";<BR>Months[6] = "七月";<BR>Months[7] = "八月";<BR>Months[8] = "九月";<BR>Months[9] = "十月";<BR>Months[10] = "十一月";<BR>Months[11] = "十二月";</FONT></P>
<P><FONT color=blue>function PadSpaces(TheString)<BR>{<BR> var Spaces = "             ";<BR> len = Math.round((9 - TheString.length)/2);</FONT></P>
<P><FONT color=blue> return Spaces.substring(0,len) + TheString;<BR>}</FONT></P>
<P><FONT color=blue>function NumLeapYears(StartYear, EndYear)<BR>{<BR>  var LeapYears, i;</FONT></P>
<P><FONT color=blue>  if (EndYear >= StartYear){<BR>   for(LeapYears = 0; StartYear <= EndYear; StartYear++)<BR>   if (IsLeapYear(StartYear)) LeapYears++;<BR> }else{<BR> for(LeapYears = 0; EndYear <= StartYear; EndYear++)<BR>   if (IsLeapYear(EndYear)) LeapYears++;<BR> }<BR>  return LeapYears;<BR>}</FONT></P>
<P><FONT color=blue>function IsLeapYear(Year) <BR>{<BR> if(Math.round(Year/4) == Year/4){<BR>  if(Math.round(Year/100) == Year/100){<BR>   if(Math.round(Year/400) == Year/400)<BR>    return true;<BR>   else return false;<BR>  }else return true;<BR> }<BR> return false;<BR>}</FONT></P>
<P><FONT color=blue>function Trim(TheString)<BR>{<BR> var len;</FONT></P>
<P><FONT color=blue> len = TheString.length;<BR>  while(TheString.substring(0,1) == " "

{ //trim left<BR> TheString = TheString.substring(1, len);<BR> len = TheString.length;<BR> }</FONT></P>
<P><FONT color=blue> while(TheString.substring(len-1, len) == " "

{ //trim right<BR>   TheString = TheString.substring(0, len-1);<BR>   len = TheString.length;<BR>  }<BR>  return TheString;<BR>}</FONT></P>
<P><FONT color=blue>function DetermineMonthIdx()<BR>{<BR> var i, month, month_s, len;</FONT></P>
<P><BR><FONT color=blue> month = Trim(document.calform.elements[4].value);<BR> len = month.length;</FONT></P>
<P><FONT color=blue> for( i = 0; i <12; i++){<BR>      month_s = Months.substring(0,len);<BR>  if (month_s.toUpperCase() == month.toUpperCase())<BR>          return (i);<BR> }<BR> return -1;<BR>}</FONT></P>
<P><FONT color=blue>function FindNewYearStartingDay(Year)<BR>{<BR>  var LeapYears, Years, Day;<BR> <BR>  LeapYears = NumLeapYears(1995, Year); </FONT></P>
<P><FONT color=blue>  if (Year >=1995)<BR>   Years = (Year -1995)+LeapYears;<BR>  else Years = (Year -1995)-LeapYears; </FONT></P>
<P><FONT color=blue>  if (Year >=1995)<BR>  Day = Math.round(((Years/7 - Math.floor(Years/7))*7)+.1);<BR>  else Day = Math.round(((Years/7 - Math.ceil(Years/7))*7)-.1);<BR> <BR> if (Year >=1995){ <BR>   if(IsLeapYear(Year)) Day--;<BR>  }else Day += 7;</FONT></P>
<P><FONT color=blue>  if(Day < 0) Day = 6;<BR>  if(Day > 6) Day = 0;<BR>  return Day;<BR>}</FONT></P>
<P><FONT color=blue>function FindNumDaysInMonth(Year, Month)<BR>{<BR>  if(Month == 1){<BR>     if(IsLeapYear(Year)) return 29;<BR>     else return 28;<BR>  }else{ <BR>     if(Month >6) Month++;<BR>     if(Month/2 == Math.round(Month/2)) return 31;<BR>  }<BR> return 30;  <BR>}</FONT></P>
<P><FONT color=blue>function FindMonthStartDay(NewYearDay, Year, Month)<BR>{<BR> var MonthStartDay;</FONT></P>
<P><FONT color=blue> AddArray = new Array(12);</FONT></P>
<P><FONT color=blue> AddArray[0]=0;AddArray[1]=3;AddArray[2]=3;AddArray[3]=6;<BR> AddArray[4]=1;AddArray[5]=4;AddArray[6]=6;AddArray[7]=2;<BR> AddArray[8]=5;AddArray[9]=0;AddArray[10]=3;AddArray[11]=5;</FONT></P>
<P><FONT color=blue> MonthStartDay = NewYearDay + AddArray[Month];<BR> if(IsLeapYear(Year) && (Month ) > 1) MonthStartDay ++;<BR> <BR> if (MonthStartDay > 6) MonthStartDay -= 7;</FONT></P>
<P><FONT color=blue> return MonthStartDay; <BR>}</FONT></P>
<P><FONT color=blue>function FillCalendar()<BR>{<BR> var Year, Month, Midx, NewYearDay, MonthStartDay;<BR> var NumDaysInMonth, i, t;</FONT></P>
<P><FONT color=blue> Year = parseFloat(document.calform.elements[1].value);<BR> Month = document.calform.elements[4].value;</FONT></P>
<P><FONT color=blue> Midx = DetermineMonthIdx();<BR> if (Midx == -1){<BR>     alert ("Can't recognize that month";<BR>     return;<BR> }</FONT></P>
<P><FONT color=blue> NewYearDay = FindNewYearStartingDay(Year);<BR> MonthStartDay = FindMonthStartDay(NewYearDay, Year, Midx);<BR> NumDaysInMonth = FindNumDaysInMonth(Year, Midx); </FONT></P>
<P><FONT color=blue> for(i = 6; i < 43; i++){<BR>  t = i-5-MonthStartDay;<BR>  if ( t >= 1 && t <= NumDaysInMonth)<BR>   document.calform.elements.value =t;<BR>  else document.calform.elements.value = "";<BR> }<BR>}</FONT></P>
<P><FONT color=blue>function IncDecYear(val)<BR>{<BR> var valNum = parseInt(val);<BR> var valNum2 = parseInt(document.calform.elements[1].value)<BR> document.calform.elements[1].value = valNum2 + valNum;</FONT></P>
<P><FONT color=blue> FillCalendar()<BR>}</FONT></P>
<P><FONT color=blue>function IncDecMonth(val)<BR>{<BR> var valNum = parseInt(val);<BR> var Midx = DetermineMonthIdx();<BR> <BR> Midx += valNum;<BR> if(Midx > 11) Midx = 0;<BR> if(Midx < 0) Midx = 11;</FONT></P>
<P><FONT color=blue><BR> document.calform.elements[4].value = PadSpaces(Months[Midx]);</FONT></P>
<P><FONT color=blue> FillCalendar()<BR>}</FONT></P>
<P><FONT color=blue>// --><BR></script><BR>     <table border=1 bgcolor="#64D0FE" cellpadding=1 cellspacing=1><BR>      <table border=0 cellpadding=0 cellspacing=0><BR>        <form name="calform"><BR>          <tr> <BR>            <td align=center cellpadding=0 cellspacing=0 bgcolor="#64D0FE"><BR>              <input<BR>type=button value="<<" onClick="IncDecYear(-1)" name="button"><BR>            </td><BR>            <th cellpadding=0 cellspacing=0 bgcolor="#aaaaaa" colspan=5<BR>align=center><BR>              <input size=4 type=text value="1993" name="text"><BR>            </th><BR>            <td align=center cellpadding=0 cellspacing=0 bgcolor="#64D0FE"><BR>              <input<BR>type=button value=">>" onClick="IncDecYear(1)" name="button2"><BR>            </td><BR>          </tr><BR>          <tr> <BR>            <td align=center bgcolor="#64D0FE"><BR>              <input type=button value="<<"<BR>onClick="IncDecMonth(-1)" name="button2"><BR>            </td><BR>            <th bgcolor="#aaaaaa" colspan=5 align=center><BR>              <input size=9 type=text<BR>value=" January " name="text"><BR>            </th><BR>            <td align=center bgcolor="#64D0FE"><BR>              <input type=button value=">>"<BR>onClick="IncDecMonth(1)" name="button2"><BR>            </td><BR>          </tr><BR>          <tr> <BR>            <th bgcolor="#ffcccc">S</th><BR>            <th bgcolor="#ccccff">M</th><BR>            <th bgcolor="#ccccff">T</th><BR>            <th bgcolor="#ccccff">W</th><BR>            <th bgcolor="#ccccff">T</th><BR>            <th bgcolor="#ccccff">F</th><BR>            <th bgcolor="#ccccff">S</th><BR>          </tr><BR>          <tr> <BR>            <td bgcolor="#ffcccc"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>          </tr><BR>          <tr> <BR>            <td bgcolor="#ffcccc"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>          </tr><BR>          <tr> <BR>            <td bgcolor="#ffcccc"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>          </tr><BR>          <tr> <BR>            <td bgcolor="#ffcccc"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>          </tr><BR>          <tr> <BR>            <td bgcolor="#ffcccc"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff" ><BR>              <input type=text size=2 name="text"><BR>            </td><BR>          </tr><BR>          <tr> <BR>            <td bgcolor="#ffcccc"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#ccccff"><BR>              <input type=text size=2 name="text"><BR>            </td><BR>            <td bgcolor="#3344aa" colspan=5><BR>              <input type=text name="text"><BR>            </td><BR>          </tr><BR>        </form><BR>      </table><BR>    </table></FONT></P>
<P><FONT color=blue><script language="JavaScript"><BR><BR></script><BR></FONT></P>

#2 複製上列語法 - 蛙 (Administrator) 發表於 25-5-2013 16:13

<form name="copy">
<textarea cols="40" name="txt" rows="4" style="BACKGROUND-COLOR:#ffffff; COLOR:#000000; FONT-SIZE:9pt">
<script language="JavaScript">
<!-- for sucky browsers

Months = new Array(12);
Months[0] = "一月";
Months[1] = "二月";
Months[2] = "三月";
Months[3] = "四月";
Months[4] = "五月";
Months[5] = "六月";
Months[6] = "七月";
Months[7] = "八月";
Months[8] = "九月";
Months[9] = "十月";
Months[10] = "十一月";
Months[11] = "十二月";

function PadSpaces(TheString)
{
var Spaces = "          ";
len = Math.round((9 - TheString.length)/2);

return Spaces.substring(0,len) + TheString;
}

function NumLeapYears(StartYear, EndYear)
{
  var LeapYears, i;

  if (EndYear >= StartYear){
for(LeapYears = 0; StartYear <= EndYear; StartYear++)
if (IsLeapYear(StartYear)) LeapYears++;
}else{
for(LeapYears = 0; EndYear <= StartYear; EndYear++)
if (IsLeapYear(EndYear)) LeapYears++;
}
  return LeapYears;
}

function IsLeapYear(Year)
{
if(Math.round(Year/4) == Year/4){
  if(Math.round(Year/100) == Year/100){
if(Math.round(Year/400) == Year/400)
return true;
else return false;
  }else return true;
}
return false;
}

function Trim(TheString)
{
var len;

len = TheString.length;
  while(TheString.substring(0,1) == " "

{ //trim left
TheString = TheString.substring(1, len);
len = TheString.length;
}

while(TheString.substring(len-1, len) == " "

{ //trim right
TheString = TheString.substring(0, len-1);
len = TheString.length;
  }
  return TheString;
}

function DetermineMonthIdx()
{
var i, month, month_s, len;

month = Trim(document.calform.elements[4].value);
len = month.length;

for( i = 0; i <12; i++){
   month_s = Months.substring(0,len);
  if (month_s.toUpperCase() == month.toUpperCase())
      return (i);
}
return -1;
}

function FindNewYearStartingDay(Year)
{
  var LeapYears, Years, Day;

  LeapYears = NumLeapYears(1995, Year);

  if  (Year >=1995)
Years = (Year -1995)+LeapYears;
  else Years = (Year -1995)-LeapYears;

  if  (Year >=1995)
  Day = Math.round(((Years/7 - Math.floor(Years/7))*7)+.1);
  else Day = Math.round(((Years/7 -  Math.ceil(Years/7))*7)-.1);

if (Year >=1995){
if(IsLeapYear(Year)) Day--;
  }else Day += 7;

  if(Day < 0) Day = 6;
  if(Day > 6) Day = 0;
  return Day;
}

function FindNumDaysInMonth(Year, Month)
{
  if(Month == 1){
   if(IsLeapYear(Year)) return 29;
   else return 28;
  }else{
   if(Month >6) Month++;
   if(Month/2 == Math.round(Month/2))  return 31;
  }
return 30;
}

function FindMonthStartDay(NewYearDay, Year, Month)
{
var MonthStartDay;

AddArray = new Array(12);

AddArray[0]=0;AddArray[1]=3;AddArray[2]=3;AddArray[3]=6;
AddArray[4]=1;AddArray[5]=4;AddArray[6]=6;AddArray[7]=2;
AddArray[8]=5;AddArray[9]=0;AddArray[10]=3;AddArray[11]=5;

MonthStartDay = NewYearDay + AddArray[Month];
if(IsLeapYear(Year)  && (Month ) > 1) MonthStartDay ++;

if (MonthStartDay > 6) MonthStartDay -= 7;

return MonthStartDay;
}

function  FillCalendar()
{
var Year, Month, Midx, NewYearDay, MonthStartDay;
var NumDaysInMonth, i, t;

Year = parseFloat(document.calform.elements[1].value);
Month = document.calform.elements[4].value;

Midx  =  DetermineMonthIdx();
if (Midx == -1){
   alert ("Can't recognize that month";
   return;
}

NewYearDay = FindNewYearStartingDay(Year);
MonthStartDay = FindMonthStartDay(NewYearDay, Year,  Midx);
NumDaysInMonth = FindNumDaysInMonth(Year, Midx);

for(i = 6;  i < 43;  i++){
  t = i-5-MonthStartDay;
  if ( t >= 1  &&  t <= NumDaysInMonth)
document.calform.elements.value =t;
  else document.calform.elements.value = "";
}
}

function IncDecYear(val)
{
var valNum = parseInt(val);
var valNum2 = parseInt(document.calform.elements[1].value)
document.calform.elements[1].value = valNum2 + valNum;

FillCalendar()
}

function IncDecMonth(val)
{
var valNum = parseInt(val);
var Midx  =  DetermineMonthIdx();

Midx += valNum;
if(Midx > 11) Midx = 0;
if(Midx < 0)  Midx = 11;

document.calform.elements[4].value = PadSpaces(Months[Midx]);

FillCalendar()
}

// -->
</script>
   <table border=1 bgcolor="#64D0FE" cellpadding=1 cellspacing=1>
   <table border=0  cellpadding=0 cellspacing=0>
      <form name="calform">
      <tr>
         <td align=center cellpadding=0 cellspacing=0 bgcolor="#64D0FE">
            <input
type=button value="<<" onClick="IncDecYear(-1)" name="button">
         </td>
         <th cellpadding=0 cellspacing=0 bgcolor="#aaaaaa" colspan=5
align=center>
            <input size=4 type=text value="1993" name="text">
         </th>
         <td align=center cellpadding=0 cellspacing=0 bgcolor="#64D0FE">
            <input
type=button value=">>" onClick="IncDecYear(1)" name="button2">
         </td>
      </tr>
      <tr>
         <td align=center bgcolor="#64D0FE">
            <input type=button value="<<"
onClick="IncDecMonth(-1)" name="button2">
         </td>
         <th bgcolor="#aaaaaa" colspan=5 align=center>
            <input size=9 type=text
value=" January " name="text">
         </th>
         <td align=center bgcolor="#64D0FE">
            <input type=button value=">>"
onClick="IncDecMonth(1)" name="button2">
         </td>
      </tr>
      <tr>
         <th  bgcolor="#ffcccc">S</th>
         <th  bgcolor="#ccccff">M</th>
         <th  bgcolor="#ccccff">T</th>
         <th  bgcolor="#ccccff">W</th>
         <th  bgcolor="#ccccff">T</th>
         <th  bgcolor="#ccccff">F</th>
         <th  bgcolor="#ccccff">S</th>
      </tr>
      <tr>
         <td  bgcolor="#ffcccc">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
      </tr>
      <tr>
         <td  bgcolor="#ffcccc">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
      </tr>
      <tr>
         <td  bgcolor="#ffcccc">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
      </tr>
      <tr>
         <td  bgcolor="#ffcccc">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
      </tr>
      <tr>
         <td  bgcolor="#ffcccc">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff" >
            <input type=text size=2 name="text">
         </td>
      </tr>
      <tr>
         <td  bgcolor="#ffcccc">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#ccccff">
            <input type=text size=2 name="text">
         </td>
         <td  bgcolor="#3344aa" colspan=5>
            <input type=text name="text">
         </td>
      </tr>
      </form>
   </table>
</table>

<script language="JavaScript">

</script>
</textarea><br>
<input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="全選">
</form>

<br>

<script type="text/javascript">
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>

笨笨網站超級論壇 (綠色版本)