一个JAVASCRIPT日期控件

使用方法：
popUpCalendar(document.Form1.input_StartTime, 'true');

/**********************************************************
*********************可设置的参数*************************/
//是否返回时间,已加入参数表

var showTime;

//是否必须点‘确定’按钮选择日期，true为必须，false直接选中，默认为false

var needClickBtnOK = false;

//控件的暗色,默认为"#AAAAAA"

var DarkColor;

//控件的亮色,默认为"#EEEEEE"

var LightColor;

//控件的按钮背景色,默认为"#E6E6F6"

var BtnBgColor;

//控件的文字颜色,默认为"#000080"

var WordColor;

//控件的暗文字颜色,默认为"#AAAAAA"

var WordDark;

//日期数字背景色,默认为"#DDDDDD"

var DayBgColor;

//今天在日历上的标示背景色,默认为"#DD8333"

var TodayColor;

//日期显示的立体表达色,默认为"#777777"

var DarkBorder;

/**********************************************************
**********************************************************/

var value;
var strIframe;

var popDiv;
var popUp;
var ifmElement;
var ifm;
var inputText;
var nowTimeTemp;

var WebCalendarWidth;
var WebCalendarNowSelect;
var WebCalendarDaysMonth;
var WebCalendarDay;
var WebCalendarDayObj;
var WebCalendarDateStyle;
var WebCalendarObjExport;
var WebCalendarInputDate;
var WebCalendarThisYear;
var WebCalendarThisMonth;
var WebCalendarThisDay;
var WebCalendarToday;
var WebCalendarDateReg;
var WebCalendarYearFall;
var WebCalendarFormat;
var WebCalendarTimeShow;
var WebCalendarDarkColor;
var WebCalendarLightColor;
var WebCalendarBtnBgColor;
var WebCalendarWordColor;
var WebCalendarWordDark;
var WebCalendarDayBgColor;
var WebCalendarTodayColor;
var WebCalendarDarkBorder;

//弹出日历选择窗口,ctr为要设置日期的文本输入框id;
//showtime为是否显示时间，'true'为显示，'false'只显示日期
function popUpCalendar(ctr,showtime){
try
{
  if (showtime != 'true' && showtime != 'false')
  {
   alert("参数showtime必须为'true'或'false'");
   return -1;
  }
  showTime=showtime;
  popUp=null;
  initIt(ctr);
}
catch(exp){
}
}

function initIt(ctr){
inputText = ctr;
value = inputText.value;
initVar();
showCalendar();
}

         for(var x=35; x<42; x++) {
    strIframe += "<td class=out id='kxDay"+ x +"'></td>";
   }

         strIframe +="</tr></table>"+
    "    </td></tr><tr><td height=20 bgcolor='"+ WebCalendarLightColor +"'>"+
    "    <table border=0 cellpadding=1 cellspacing=0 width=100%>"+
    "    <tr height='18px'><td id='nowSelectObj' width='89px'> </td><td colspan=2 align='left'>";
    if (WebCalendarTimeShow){
    //var nowTimeTemp = new Date();
    strIframe+="<INPUT type='text' readonly id='hou' style='LEFT: 84px; WIDTH: 20px; POSITION: absolute; TOP: 172px; HEIGHT: 16px'>";
    strIframe+="<INPUT id='addhour' style='Z-INDEX: 101; LEFT: 105px; WIDTH: 16px; POSITION: absolute; TOP: 172px; HEIGHT: 8px' type='button' value=''>";
    strIframe+="<INPUT id='subhour' style='Z-INDEX: 102; LEFT: 105px; WIDTH: 16px; POSITION: absolute; TOP: 181px; HEIGHT: 8px' type='button' value=''>";
    strIframe+="<span style='LEFT: 122px; POSITION: absolute; '>时</span>";
    strIframe+="<INPUT id='min' readonly style='LEFT: 137px; WIDTH: 20px; POSITION: absolute; TOP: 172px; HEIGHT: 16px' type='text'>";
    strIframe+="<INPUT id='addmin' style='Z-INDEX: 103; LEFT: 158px; WIDTH: 16px; POSITION: absolute; TOP: 172px; HEIGHT: 8px' type='button' value='Button'>";
    strIframe+="<INPUT id='submin' style='Z-INDEX: 104; LEFT: 158px; WIDTH: 16px; POSITION: absolute; TOP: 181px; HEIGHT: 8px' type='button' value='Button'>";
    strIframe+="<span style='LEFT: 175px; POSITION: absolute; '>分</span>";
    strIframe+="<INPUT id='sec' readonly style='LEFT: 190px; WIDTH: 20px; POSITION: absolute; TOP: 172px; HEIGHT: 16px' type='text'>";
    strIframe+="<INPUT id='addsec' style='Z-INDEX: 105; LEFT: 211px; WIDTH: 16px; POSITION: absolute; TOP: 172px; HEIGHT: 8px' type='button' value='Button'>";
    strIframe+="<INPUT id='subsec' style='Z-INDEX: 106; LEFT: 211px; WIDTH: 16px; POSITION: absolute; TOP: 181px; HEIGHT: 8px' type='button' value='Button'>";
    strIframe+="<span style='LEFT: 228px; POSITION: absolute; '>秒</span>";
    /*

    */

}
    strIframe+=" </td></tr>"+
    "    <tr><td align='left'>&nbsp</td><td align=center>"+
    "    </td><td align='right'><input name=today type=button value='现在' onfocus='this.blur()' class='inputstyle' style='width: 30' title='当前日期'> <input name='doOk' type=button value='确定' onfocus='this.blur()' class='inputstyle' style='width: 30'> <input type='button' name='closeCalendar' value='关闭' class='inputstyle' style='width: 30' title='取消'></td></tr></table>"+
    "</td></tr><table></form></body></html>";

    }
    catch(excp4) {}
}
var interset;
function writeIframe(){

if (strIframe == null){
  Iframe();
}
with(popUp)
    {
  document.writeln(strIframe);
  document.close();
  //document.body.onkeydown=doKeyDown;
  with(document.all){
   kxYearHead.onclick=funYearSelect;
   kxYearMonth.onclick=funMonthSelect;
   prevYear.onclick=prevY;
   prevMonth.onclick=prevM;
   nextMonth.onclick=nextM;
   nextYear.onclick=nextY;
   today.onclick=setToday;
   tmpYearSelect.onchange=newYearSelect;
   tmpYearSelect.onblur=hiddenSelect;
   tmpMonthSelect.onchange=newMonthSelect;
   tmpMonthSelect.onblur=hiddenSelect;
   doOk.onclick=returnDate;
   closeCalendar.onclick=hiddenCalendar;

   for(var i=0; i<42; i++)
         {
             WebCalendarDayObj[i] = eval("kxDay"+ i);
             WebCalendarDayObj[i].onmouseover = dayMouseOver;
             WebCalendarDayObj[i].onmouseout = dayMouseOut;
             WebCalendarDayObj[i].onmouseup   = newDateSelect;
             //WebCalendarDayObj[i].onclick     = newDateSelect;
         }
         if (WebCalendarTimeShow){
    //
    //addhour.onclick=addH;
    addhour.onmousedown=addHour;
    addhour.onmouseup=addaHou;
    addhour.onmouseout=stop;
    //
    //subhour.onclick=subH;
    subhour.onmousedown=subHour;
    subhour.onmouseup=subaHou;
    subhour.onmouseout=stop;
    //
    //addmin.onclick=addM;
    addmin.onmousedown=addMin;
    addmin.onmouseup=addaMin;
    addmin.onmouseout=stop;
    //
    //submin.onclick=subM;
    submin.onmousedown=subMin;
    submin.onmouseup=subaMin;
    submin.onmouseout=stop;
    //
    //addsec.onclick=addS;
    addsec.onmousedown=addSec;
    addsec.onmouseup=addaSec;
    addsec.onmouseout=stop;
    //
    //subsec.onclick=subS;
    subsec.onmousedown=subSec;
    subsec.onmouseup=subaSec;
    subsec.onmouseout=stop;
    //
    popUp.document.all.hou.value = appendZero(nowTimeTemp.getHours());
    popUp.document.all.min.value = appendZero(nowTimeTemp.getMinutes());
    popUp.document.all.sec.value = appendZero(nowTimeTemp.getSeconds());
         }

  }
    }
}

//
function stop(){
clearInterval(interset);
}
function addHour(){
clearInterval(interset);
interset=setInterval("addH()",120);
}
function addaHou(){
stop();
addH();
}
function subaHou(){
stop();
subH();
}
function subHour(){
clearInterval(interset);
interset=setInterval("subH()",120);
}
function addH(){
var h = parseInt(popUp.document.all.hou.value,10) + 1;
popUp.document.all.hou.value = h > 23? "00" : (h<10?appendZero(h):h);
}
function subH(){
var h = parseInt(popUp.document.all.hou.value,10) - 1;
popUp.document.all.hou.value=h < 0 ? "23" : appendZero(h);
}
function addaMin(){
stop();
addM();
}
function subaMin(){
stop();
subM();
}
function addMin(){
clearInterval(interset);
interset=setInterval("addM()",120);
}
function subMin(){
clearInterval(interset);
interset=setInterval("subM()",120);
}
function addM(){
var m = parseInt(popUp.document.all.min.value,10) + 1;
popUp.document.all.min.value = m > 59? "00" : appendZero(m);
}
function subM(){
var m = parseInt(popUp.document.all.min.value,10) - 1;
popUp.document.all.min.value = m < 0? "59" : appendZero(m);
}
function addaSec(){
stop();
addS();
}
function subaSec(){
stop();
subS();
}
function addSec(){
clearInterval(interset);
interset=setInterval("addS()",120);
}
function subSec(){
clearInterval(interset);
interset=setInterval("subS()",120);
}
function addS(){
var s = parseInt(popUp.document.all.sec.value,10) + 1;
popUp.document.all.sec.value = s > 59? "00" : appendZero(s);
}
function subS(){
var s = parseInt(popUp.document.all.sec.value,10) - 1;
popUp.document.all.sec.value = s < 0? "59" : appendZero(s);
}
//

function appendZero(n){
return (("00" + n).substr(("00" + n).length - 2));
}

function String.prototype.trim(){
return this.replace(/(^\s*)|(\s*$)/g,"");
}

function hiddenSelect(nows){
try{
  var ee=nows;
  for(var i = (ee.options.length - 1); i > -1; i--)
  {
   ee.options.remove(i);
  }
  nows.style.display="none";
}catch(e){}
}

function hiddenCalendar(){
if(popUp){
  if(popUp.isOpen){
   popUp.hide();
  }
}
}

function newYearSelect(){
WebCalendarThisYear =this.value;
writeCalendar();
hiddenSelect(popUp.document.all.tmpYearSelect);
}

function hidenYearSelect(){
hiddenSelect(popUp.document.all.tmpYearSelect);
}

function newMonthSelect(){
WebCalendarThisMonth=this.value;
hiddenSelect(popUp.document.all.tmpMonthSelect);
writeCalendar();
}

function hidenMonthSelect(){
hiddenSelect(popUp.document.all.tmpMonthSelect);
}

function hiddenAllSelect(){
hidenMonthSelect();
hidenYearSelect();
}

function setToday(){
WebCalendarNowSelect = WebCalendarToday;
var a = WebCalendarToday.split("/");
WebCalendarThisYear = a[2];
WebCalendarThisMonth = a[1];
WebCalendarThisDay = a[0];
if(WebCalendarTimeShow){
nowTimeTemp = new Date();
writeIframe();
}
writeCalendar();
}

//往前翻月份

//往后翻月份

//往前翻 Year

function prevY()
{
try
{
  //WebCalendarThisDay = 1;
  hidenYearSelect();
  hidenMonthSelect();
  WebCalendarThisYear--;
  writeCalendar();
} catch(e) {}
}

//往后翻 Year

function nextY()
{
try
{
  //WebCalendarThisDay = 1;
  hidenYearSelect();
  hidenMonthSelect();
  WebCalendarThisYear++;
  writeCalendar();
} catch(e) {}
}

//根据日期格式等返回用户选定的日期

posted on 2006-05-21 05:37 落拓孤鸿阅读(996) 评论(0) 编辑收藏举报

会员力量，点亮园子希望

刷新页面返回顶部

应该感谢那些指出你错误的人

公告