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

原创 2007年09月12日 16:59:00
在页面代码中使用
...
<script language="javascript" src="../public/datetime.js"></script>
<script language="javascript" type="text/javascript">
...
function submit()
{
...
if(isDate("starttime")==false){return false;}//提交时检查时间是否输入正确
...
}
</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("datetime").value=changedatetime("datetime");//将时间格式化
</script>

日期时间格式化函数
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 cursorpos1=0;//光标结束位置
var keytext;
var curtext=range.text;//当前input框文本
var charbuff;//暂存字符
while(selrange.compareEndPoints("StartToStart",range)>0)//比较 TextRange 对象的结束点和其它范围的结束点。
{
selrange.moveStart("character",-1);//更改范围的开始位置。Moves one or more characters
startpos ++;
}
oLength=curtext.length;

if(startpos>18)//光标位置超出范围
   {   
    if(event.keyCode==8)//后退键特殊情况
        { oLeft=curtext.substring(0,startpos);oRight="0";
          oInput.value=oLeft+oRight;
          range.moveStart("character",19); 
          range.collapse(true);//将插入点移动到当前范围的开始或结尾。 
          range.select();
          } //将当前选中区置为当前对象。}
    else if(event.keyCode==46||event.keyCode==39||event.keyCode==40)
          {         
          range.moveStart("character",19); 
          range.collapse(true);
          range.select();
        }
    else if(event.keyCode==37)//向前键
          {         
          range.moveStart("character",19); 
          range.collapse(true); 
          range.select();
        }
    else if(event.keyCode==38)//向上键
          {
          range.moveStart("character",18); 
          range.collapse(true); 
          range.select();
        }
    else{
         oInput.value = curtext.substring(0,18);
         range.moveStart("character",18);
          range.moveEnd("character",19);
         range.collapse(true); 
          range.select(); //将当前选中区置为当前对象。
         }
    }
else if(event.keyCode>47&&event.keyCode<58)//按键是数字
   {
    if(startpos==0)
        {oLeft="";oRight=curtext.substring(1,oLength);cursorpos=0;cursorpos1=1;}  
     else if(startpos==4||startpos==7)
        {oLeft=curtext.substring(0,startpos)+"-";oRight=curtext.substring(startpos+2,oLength);cursorpos=1;cursorpos1=2;}
     else if(startpos==10)
        {oLeft=curtext.substring(0,startpos)+" ";oRight=curtext.substring(startpos+2,oLength);cursorpos=1;cursorpos1=2;}
     else if(startpos==13||startpos==16)
       {oLeft=curtext.substring(0,startpos)+":";oRight=curtext.substring(startpos+2,oLength);cursorpos=1;cursorpos1=2;}
     else if(startpos>0&&startpos<19)
       {oLeft=curtext.substring(0,startpos);oRight=curtext.substring(startpos+1,oLength);cursorpos=0;cursorpos1=1;}
        oInput.value = oLeft+oRight;
       range.moveStart("character",startpos+cursorpos);
       range.moveEnd("character",startpos+cursorpos1);
       range.collapse(true); 
       range.select();       
  }
else if(event.keyCode==8)//后退按键时,当前一个字符为"-"或" "或":"时不变,否则替换为"0"
  {
     if(startpos==0)
        {oLeft="";oRight=curtext.substring(startpos,oLength);}
      else if(startpos==14||startpos==17)
        {oLeft=curtext.substring(0,startpos);oRight=":"+curtext.substring(startpos,oLength);}
      else if(startpos==11)
        {oLeft=curtext.substring(0,startpos);oRight=" "+curtext.substring(startpos,oLength);}
      else if(startpos==5||startpos==8)
        {oLeft=curtext.substring(0,startpos);oRight="-"+curtext.substring(startpos,oLength);}
      else if(startpos==1||startpos==2||startpos==3||startpos==4||startpos==6||startpos==7||startpos==9||startpos==10||startpos==12||startpos==13||startpos==15||startpos==16||startpos==18)
        {oLeft=curtext.substring(0,startpos);oRight="0"+curtext.substring(startpos,oLength);}
      else
        {oLeft=curtext.substring(0,startpos);oRight=curtext.substring(startpos-1,oLength);}
     oInput.value = oLeft+oRight;
     range.moveStart("character",startpos); 
     range.collapse(true); 
     range.select(); 
   }
else if(event.keyCode==46)//delete按键,当后一个字符为"-"或" "或":"时不变,否则替换为"0"
  {
      if(startpos==0)
        {oLeft="0";oRight=curtext.substring(startpos,oLength);}
      else if(startpos==13||startpos==16)
        {oLeft=curtext.substring(0,startpos)+":";oRight=curtext.substring(startpos,oLength);}
      else if(startpos==10)
        {oLeft=curtext.substring(0,startpos)+" ";oRight=curtext.substring(startpos,oLength);}
      else if(startpos==4||startpos==7)
        {oLeft=curtext.substring(0,startpos)+"-";oRight=curtext.substring(startpos,oLength);}
      else if(startpos==1||startpos==2||startpos==3||startpos==5||startpos==6||startpos==8||startpos==9||startpos==11||startpos==12||startpos==14||startpos==15||startpos==17||startpos==18)
        {oLeft=curtext.substring(0,startpos)+"0";oRight=curtext.substring(startpos,oLength);}
      else
        {oLeft=curtext.substring(0,startpos+1);oRight=curtext.substring(startpos,oLength);} 
    oInput.value = oLeft+oRight;
    range.moveStart("character",startpos+1); 
    range.collapse(true); 
    range.select(); 
   }
else if(event.keyCode==38)//向上键
   {
    range.moveStart("character",startpos-1); 
    range.collapse(true); 
    range.select();
   }
else if(event.keyCode==40)//向下键
   {
    range.moveStart("character",startpos+1); 
    range.collapse(true); 
    range.select();
    }
else //其他按键不做反应
  {
    oLeft=curtext.substring(0,startpos);
    oRight=curtext.substring(startpos,oLength);
    oInput.value = oLeft+oRight;
    range.moveStart("character",startpos); 
    range.collapse(true); 
    range.select(); 
  }
}
function changedatetime(objectname)//将日期格式规范化成 yyyy-mm-dd hh-mm-ss
{
  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)
}
function isDate(checktext)//日期时间检查

  var   datetime; 
  var   year,month,day,hour,munite,second; 
  var   gone,gtwo,gthree,gfour,gfive; 
     datetime=document.all(checktext).value;
      year=datetime.substring(0,4); 
      gone=datetime.substring(4,5); 
      month=datetime.substring(5,7); 
      gtwo=datetime.substring(7,8); 
      day=datetime.substring(8,10);
      gthree=datetime.substring(10,11);
      hour=datetime.substring(11,13);
      gfour=datetime.substring(13,14);
      munite=datetime.substring(14,16);
      gfive=datetime.substring(16,17);
      second=datetime.substring(17,19);
      if((gone=="-")&&(gtwo=="-")&&(gthree==" ")&&(gfour==":")&&(gfive==":"))
        { 
          if(month<1||month>12){alert("月份必须在01和12之间!");return false;}   
          if(day<1||day>31){alert("日期必须在01和31之间!");return false;}
          else{ 
                 if(month==2)
                  {     
                   if((year%4)==0&&day>29){alert("二月份日期必须在01到29之间!");return false;}               
                   if((year%4)>0&&day>28){alert("二月份日期必须在01到28之间!");return false;}   
                  }   
                 if((month==4||month==6||month==9||month==11)&&(day>30)){alert(" 在四,六,九,十一月份   /n日期必须在01到30之间!");return   false;}   
               }
          if(hour>23){alert("小时必须在00和24之间!");return false;}
          if(munite>59){alert("分钟必须在00和60之间!");return false;}
          if(second>59){alert("秒必须在00和60之间!");return false;}
         }
      else
        { 
           alert("请输入日期!格式为(yyyy-mm-dd hh-mm-ss)   /n例(2001-01-01 01:00:00)");
           return   false; 
         } 
return true;  
}  

jsp 页面 input 中指定时间格式

根据指定的格式显示时间: 注册时间                                                                           va...
  • Java_WuYY
  • Java_WuYY
  • 2015年11月26日 11:03
  • 7025

input 和<fmt:formatDate>的结合使用

" class="date" [pattern="yyyy-MM-dd"] [yearstart="-80"] [yearend="5"] /> http://devbbs.doit.com...
  • chinesesword
  • chinesesword
  • 2012年05月18日 16:59
  • 8492

jsp显示页面加载时间

pageEncoding="UTF-8"%> 页面加载时间 #out{width:300px;height:20px;background:#EEEEEE;} #in{wid...
  • pangqiandou
  • pangqiandou
  • 2017年02月25日 11:10
  • 757

jsp中输入框字符校验

首先,看一段正则表达式:/([\u4E00-\u9FA5]|[A-Za-z])+/|' '  这段正则表达式的意思在ASCII码中的意思为中文字符,有兴趣的同学可以去查一查 举个栗子,来校验一个输入...
  • mikky_android
  • mikky_android
  • 2017年02月27日 11:09
  • 985

jsp输入框日期时间控件

  • 2010年05月11日 14:38
  • 112KB
  • 下载

JSP学习之路(一):JSP可输入下拉框编写代码

this.parentNode.nextSibling.value:的父节点即的兄弟节点。 this.value :去父节点中的值。 position:absolute:设置此属性值为 absol...
  • H90P0820
  • H90P0820
  • 2014年02月26日 14:54
  • 2915

springmvc:jsp fmt标签格式化Date时间,格式化后可以用于页面展示或者提交给后台

场景一:         只用于页面展示 就会格式化成 yyyy-MM-dd 场景二:         不仅要展示还要再提交给后台,例如你想修改一个页面的值,点击修改,页面会先展示数据,然后你修改数...
  • wabiaozia
  • wabiaozia
  • 2016年01月28日 18:54
  • 5585

jsp日期选择框 ,无需第三方js控件

----------------------------------------------------------------------------------------------------...
  • today1858
  • today1858
  • 2010年09月08日 21:45
  • 18344

解决jsp中input标签读取时间格式实例显示到页面

版权声明:本文为博主原创文章,未经博主允许不得转载。 问题描述:在我的spring框架与数据库(datetime)有这样一个声明为java.util.Date类型的实例buildTime,当我对此...
  • wh727536384
  • wh727536384
  • 2016年09月22日 15:56
  • 5087

如何对input type=text 设置时间格式

th class="formTitle">创建时间:th>                    td class="formValue">                        @**@  ...
  • zhuoyue008
  • zhuoyue008
  • 2017年01月14日 10:03
  • 3377
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:用javascript实现input框日期时间格式化输入
举报原因:
原因补充:

(最多只允许输入30个字)