用户名: 密   码:
   飞诺网 加入收藏
飞诺网 网页设计 FrontPage Dreamweaver html Javascript css 网页制作技巧 网页特效 色彩原理 设计理念 web技术文档
Javascript系列教程 Javascript实例 Javascript技术文档

您当前的位置:飞诺网 >>  网页设计 >>  Javascript >> Javascript技术文档

用javascript实现input框日期时间格式化输入

www.diybl.com    时间 : 2007-09-23  作者:佚名   编辑:本站 点击:   [ 评论 ]

以下js文件是一种日期时间格式化输入函数,有兴趣还可以加入日期验证函数
datetime.js
function inputdatetime(objectname)
{
var oInput=document.all(objectname);
var range=document.all(objectname).createTextRange();//为元素创建一个 TextRange 对象。
var selrange = document.selection.createRange();//从当前文本选中区中创建 TextRange 对象
var startpos = 0,endpos = 0;
var oLeft;
var oRight;
var oLength;
var pos;
var cursorpos=0;//光标下一个相对位置
var keytext;
while(selrange.compareEndPoints("StartToStart",range)>0)//比较 TextRange 对象的结束点和其它范围的结束点。
{
selrange.moveStart("character",-1);//更改范围的开始位置。Moves one or more characters
startpos ++;
}
oLength=oInput.value.length;
if(startpos>18){oLeft=oInput.value.substring(0,18);
    oInput.value = oLeft;
    range.moveStart("character",18); 
    range.collapse(true); 
    range.select();  }
if(event.keyCode>47&&event.keyCode<58)
  {
   if(startpos==0)
       {oLeft="";oRight=oInput.value.substring(1,oLength);cursorpos=1;}
   else if(startpos==3||startpos==6||startpos==9||startpos==12||startpos==15)
       {oLeft=oInput.value.substring(0,startpos);oRight=oInput.value.substring(startpos+1,oLength);cursorpos=2;}
   else if(startpos==4||startpos==7)
      {oLeft=oInput.value.substring(0,startpos)+"-";oRight=oInput.value.substring(startpos+2,oLength);cursorpos=2;}
   else if(startpos==10)
      {oLeft=oInput.value.substring(0,startpos)+" ";oRight=oInput.value.substring(startpos+1,oLength);cursorpos=2;}
   else if(startpos==13||startpos==16)
       {oLeft=oInput.value.substring(0,startpos)+":";oRight=oInput.value.substring(startpos+2,oLength);cursorpos=2;}
   else if(startpos>0)
       {oLeft=oInput.value.substring(0,startpos);oRight=oInput.value.substring(startpos+1,oLength);cursorpos=1;}
  keytext=String.fromCharCode(event.keyCode);
  oInput.value = oLeft+keytext+oRight;
  range.moveStart("character",startpos+cursorpos); 
  range.collapse(true); 
  range.select(); 
  }
else if(event.keyCode==8)//后退按键
  {
    oLeft=oInput.value.substring(0,startpos);
    oRight=oInput.value.substring(startpos,oLength);
    if(startpos==0){keytext="";}
    else if(startpos==5||startpos==8){keytext="-";}
    else if(startpos==11){keytext=" ";}
    else if(startpos==14||startpos==17){keytext=":";}
    else if(startpos==19){keytext="0";oRight="0";}
    else{keytext="0";}
    oInput.value = oLeft+keytext+oRight;
    range.moveStart("character",startpos); 
    range.collapse(true); 
    range.select(); 
   }
else if(event.keyCode==46)//delete按键
  {
    oLeft=oInput.value.substring(0,startpos);
    oRight=oInput.value.substring(startpos,oLength);
    if(startpos==0){keytext="0";}
    else if(startpos==4||startpos==7){keytext="-";}
    else if(startpos==10){keytext=" ";}
    else if(startpos==13||startpos==16){keytext=":";}
    else{keytext="0";}
    oInput.value = oLeft+keytext+oRight;
    range.moveStart("character",startpos+1); 
    range.collapse(true); 
    range.select(); 
   }
else if(event.keyCode==40||event.keyCode==39)//向后向下键
   {
    range.moveStart("character",startpos+1); 
    range.collapse(true); 
    range.select();
    }
else if(event.keyCode==37||event.keyCode==38)//向前向上键
   {
    range.moveStart("character",startpos-1); 
    range.collapse(true); 
    range.select();
   }
else
  {
    oLeft=oInput.value.substring(0,startpos);
    oRight=oInput.value.substring(startpos,oLength);
    oInput.value = oLeft+oRight;
    range.moveStart("character",startpos); 
    range.collapse(true); 
    range.select(); 
  }
}

//将日期改为标准形式 yyyy-mm-dd hh-mm-ss
function changedatetime(objectname)
{
  var textbuff;
  var year,month,day,minute,hour,second;
  var curtext=document.all(objectname).value;
  year=curtext.substring(0,curtext.indexOf("-"));
  curtext=curtext.substring(curtext.indexOf("-")+1,curtext.length)
  month=curtext.substring(0,curtext.indexOf("-"));
  if(month.length<2){month="0"+month;}
  curtext=curtext.substring(curtext.indexOf("-")+1,curtext.length)
  day=curtext.substring(0,curtext.indexOf(" "));
  if(day.length<2){day="0"+day;}
  curtext=curtext.substring(curtext.indexOf(" ")+1,curtext.length)
  hour=curtext.substring(0,curtext.indexOf(":"));
  if(hour.length<2){hour="0"+hour;}
  curtext=curtext.substring(curtext.indexOf(":")+1,curtext.length)
  minute=curtext.substring(0,curtext.indexOf(":"));
  if(minute.length<2){minute="0"+minute;}
  curtext=curtext.substring(curtext.indexOf(":")+1,curtext.length)
  second=curtext.substring(0,curtext.length);
   if(second.length<2){second="0"+second;}
   return ( year+"-"+month+"-"+day+" "+minute+":"+hour+":"+second)
}

页面调用
...
<script language="javascript" src="../public/datetime.js"></script>
...
时 间:<input name="datetime" type="text" onkeyDown="inputdatetime('starttime')"  value="0000-00-00 00:00:00" size="20" maxlength="19"  />
... 

<script language="javascript" type="text/javascript">
document.all("starttime").value=changedatetime("starttime");//将从数据库提取的日期换为标准形式

</script>



如果图片或页面不能正常显示请点击这里
Javascript技术文档推荐文章

文章评论