📄 selectdate.htm

📁 javascript 实现弹出式日期选择框。
💻 HTM
字号:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!-- saved from url=(0055)http://218.26.238.66//tasendres/res/html/selectdate.htm -->
<!-- saved from url=(0052)http://www.airticket.com.cn/Component/selecttime.htm --><HTML><HEAD><TITLE>选择时间</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<STYLE>.input1 {
	BORDER-RIGHT: black 0px solid; BORDER-TOP: black 0px solid; FONT-SIZE: 9pt; BACKGROUND: none transparent scroll repeat 0% 0%; BORDER-LEFT: black 0px solid; CURSOR: hand; COLOR: #0000ff; BORDER-BOTTOM: black 0px solid; FONT-FAMILY: "宋体"; HEIGHT: 15px; TEXT-DECORATION: none
}
.input1:hover {
	FONT-WEIGHT: bold
}
TD {
	FONT-SIZE: 9pt; FONT-FAMILY: "宋体"
}
SELECT {
	FONT-SIZE: 9pt; FONT-FAMILY: "宋体"
}
INPUT {
	FONT-SIZE: 9pt; LINE-HEIGHT: 12pt; FONT-FAMILY: "宋体"; HEIGHT: 18px
}
</STYLE>

<SCRIPT language=javascript>
function checkinput()
  {
    while (isNaN(document.all.years.value) || (document.all.years.value==" ")) 
    {
       document.all.years.value=years.value.substring(0,years.value.length-1)
    }
  }

function numberofdays(month,year)
  {
  var numdays=new Array(31,28,31,30,31,30,31,31,30,31,30,31)
  n=numdays[month]
  
  if (month==1&&year%4==0) ++n
  
  return n
  }

function displaydates(day,month,year,shade){
  d=new Date(year,month,1)
  var startday=d.getDay()
  var numdays=numberofdays(month,year)
  var numrows=Math.ceil((numdays+startday)/7)

  var tmps=""
  if((numdays+startday)%7>1) ++numrows
  var currentdate=0
  
  tmps="<table border=0 cellpadding=2 style=\"font-weight:bold\" cellspacing=0><tr><td align='center'>日</td><td align='center'>一</td><td align='center'>二</td><td align='center'>三</td><td align='center'>四</td><td align='center'>五</td><td align='center'>六</td></tr><tr ><td colspan=7 height=5 ></td></tr><tr><td colspan=7 bgcolor=black><spacer height=1 type=block></td></tr>"
  for (var i=0;i<numrows;++i)
    {
    tmps=tmps+"<tr>"
    for(var j=0;j<7;++j){
     if (shade&&day==currentdate&&currentdate<numdays&&i*7+j>=startday)
       //tmps=tmps+"<td bgcolor='#DDDDDD' style='border:1px solid #909090'>"
	   tmps=tmps+"<td background=\"today.gif\">"
       else tmps=tmps+"<td>"
     if(currentdate>=numdays) tmps=tmps+" "
       else if(currentdate>0){
        ++currentdate
        tmps=tmps+writedate(currentdate)
        } else if(i*7+j>=startday){
        ++currentdate
        tmps=tmps+writedate(currentdate)
        }else tmps=tmps+" "
     tmps=tmps+"</td>"
     }
    tmps=tmps+"</tr>"
    }
  //tmps=tmps+"<tr ><td colspan=7 height=5 ></td></tr><td colspan=7 bgcolor=black><spacer height=1 type=block></td></tr><tr ><td colspan=7 align=center><br>"
  
  //tmps=tmps+"<input type='button' class=input1 value='关闭' style='width:23' onclick='setvalue1(2)'></td></tr></table>"
  return tmps
  }
          
function writedate(n){
return "<input type='button' class=input1 value='"+n.toString()+"' style='width:20;font-weight:bold' onclick='setvalue("+n.toString()+")'>"

}

function setvalue(n)
  {
  window.returnValue=document.all.years.value+"-"+document.all.months.value+"-"+n
  document.all.days.value=n.toString()
  window.close();
  }
function setvalue1(n)
  {
  //window.returnValue=document.all.years.value+"-"+document.all.months.value+"-"+n
  document.all.days.value=n.toString()
  window.returnValue=n
  window.close();
  }

function showdates()
  {

  if ((event.x+150)>document.body.offsetWidth )
    datesbox.style.left=event.x+document.body.scrollLeft-150
    else
    datesbox.style.left=event.x+document.body.scrollLeft
  if ((event.y+165)>document.body.offsetHeight )  
    datesbox.style.top=event.y+document.body.scrollTop-165
    else
    datesbox.style.top=event.y+document.body.scrollTop
  if (datesbox.style.visibility=="visible")
    datesbox.style.visibility="hidden"
    else
    datesbox.style.visibility="visible"
  yearadd(0)
  }

function showdates2()
  {
  if (datesbox.style.visibility=="visible")
    datesbox.style.visibility="hidden"
    }
  
function changeit(d,m,y)
  {
  daysin.innerHTML=displaydates(d,m-1,y,true)
  }
  
function yearadd(n)
  {
  years.value=(eval(years.value)+n).toString()

  changeit(eval(days.value)-1,eval(months.value),eval(years.value))
  }
  function monthsadd()
  {
	if(document.all.months.options.selectedIndex >= document.all.months.options.length-1)
	{
		years.value=(eval(years.value)+1).toString()
		document.all.months.options.selectedIndex = 0
		changeit(eval(days.value)-1,eval(months.value),eval(years.value))
		return
	}
	document.all.months.options.selectedIndex = document.all.months.options.selectedIndex + 1;
	changeit(eval(days.value)-1,eval(months.value),eval(years.value))
  }
  function monthdel()
  {
	if(document.all.months.options.selectedIndex <= 0)
	{
		years.value=(eval(years.value)-1).toString()
		document.all.months.options.selectedIndex = document.all.months.options.length-1
		changeit(eval(days.value)-1,eval(months.value),eval(years.value))
		return
	}
	document.all.months.options.selectedIndex = document.all.months.options.selectedIndex - 1;
	changeit(eval(days.value)-1,eval(months.value),eval(years.value))
  }
	</SCRIPT>

<META content="MSHTML 6.00.3790.1830" name=GENERATOR></HEAD>
<BODY oncontextmenu="return false;" style="FONT-SIZE: 9pt">
<DIV align=center>
<TABLE height="100%" cellSpacing=0 cellPadding=0 width="100%" border=0>
  <TBODY>
  <TR>
    <TD width="100%">
      <TABLE id=datesbox height=23 cellSpacing=2 cellPadding=0 width="100%" 
      bgColor=#dedfde border=0>
        <TBODY>
        <TR>
          <TD vAlign=center align=middle width=25 rowSpan=2>
            <DIV style="CURSOR: hand" onclick=monthdel() name="yearup"><IMG 
            alt=月份向前 src="image/but_prev.gif"></DIV></TD>
          <TD vAlign=center align=middle width=30 rowSpan=2><INPUT type=hidden 
            size=2 name=days> <INPUT onblur=checkinput() 
            onkeyup=checkinput();changeit(eval(days.value),eval(months.value),eval(years.value)) 
            style="HEIGHT: 18px" maxLength=4 size=4 value=0 name=years> </TD>
          <TD vAlign=bottom width=20 height=11>
            <DIV style="CURSOR: hand" onclick=yearadd(1) name="yearup"><IMG 
            alt=年份向后 src="image/up.gif"></DIV>
            <DIV style="CURSOR: hand" onclick=yearadd(-1) name="yeardown" 
            valign="top"><IMG alt=年份向前 src="image/down.gif"></DIV></TD>
          <TD width=79 rowSpan=2><SELECT style="length: 320" 
            onchange=changeit(eval(days.value)-1,eval(months.value),eval(years.value)) 
            name=months> <OPTION value=1 selected>一月</OPTION> <OPTION 
              value=2>二月</OPTION> <OPTION value=3>三月</OPTION> <OPTION 
              value=4>四月</OPTION> <OPTION value=5>五月</OPTION> <OPTION 
              value=6>六月</OPTION> <OPTION value=7>七月</OPTION> <OPTION 
              value=8>八月</OPTION> <OPTION value=9>九月</OPTION> <OPTION 
              value=10>十月</OPTION> <OPTION value=11>十一月</OPTION> <OPTION 
              value=12>十二月</OPTION></SELECT> </TD>
          <TD vAlign=center align=middle width=10 rowSpan=2>
            <DIV style="CURSOR: hand" onclick=monthsadd() name="yearup"><IMG 
            alt=月份向后 src="image/but_next.gif"></DIV></TD></TR>
        <TR>
          <TD vAlign=top width=20></TD></TR></TBODY></TABLE></TD></TR>
  <TR>
    <TD align=middle width="100%" height="100%">
      <DIV id=daysin style="PADDING-TOP: 4px"></DIV>
      <DIV></DIV>
      <SCRIPT language=javascript>
		//显示时间
			var strtoday = "";
			var strtoday2 = "";
			function initdates()
			{
			   var d=new Date()
			   strtoday = ( (d.getMonth()+1) + "/"+(d.getDate())+ "/"+d.getYear())
			   strtoday2 = ( d.getYear()+ "-"+(d.getMonth()+1)+ "-"+(d.getDate()))
				
			   days.value=d.getDate()
			   months.value=d.getMonth()+1
			   years.value=d.getYear()
			   window.returnValue = ""
			   //window.returnValue=d.getYear().toString()+"-"+(d.getMonth()+1).toString()+"-"+(d.getDate()).toString()
			   daysin.innerHTML=displaydates(d.getDate()-1,d.getMonth(),d.getYear(),true)
			}
			initdates();
		</SCRIPT>
    </TD></TR>
  <TR>
    <TD width="100%">
      <TABLE style="FONT-WEIGHT: bold; FONT-SIZE: 9pt" height=24 cellSpacing=0 
      cellPadding=0 width="100%" bgColor=#dedfde border=0>
        <TBODY>
        <TR>
          <TD width="33%" height=24>
            <DIV style="CURSOR: hand" onclick=setvalue1(strtoday2) 
name="yearup">
            <P align=center><IMG alt=今天 
          src="image/but_today.gif"></P></DIV></TD>
          <TD id=daysin2 align=middle width="33%" height=24>
            <SCRIPT>document.write(strtoday)</SCRIPT>
          </TD>
          <TD width="34%" height=24>
            <DIV style="CURSOR: hand" onclick='setvalue1("null")' name="yearup">
            <P align=center><IMG alt=清空 
          src="image/but_none.gif"></P></DIV></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></DIV></BODY></HTML>
💿 文件大小 6 K
👤 上传用户 BEIJINGHUANYING
📂 所属分类 JavaScript
🏷️ 相关标签

#javascript
⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -