一个输入框输入日期或时间，并验证输入

最新推荐文章于 2024-01-12 10:48:19 发布

qx04007

最新推荐文章于 2024-01-12 10:48:19 发布

阅读量509

点赞数

分类专栏： JS

本文链接：https://blog.csdn.net/qx04007/article/details/84014980

版权

JS 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> IT知道网_www.itwis.com(一个输入框输入日期或时间，并验证输入) </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="zourinet">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">

<script>
function isDateTime(str){
var a = str.match(/^(\d{0,4})-(\d{0,2})-(\d{0,2}) (\d{0,2}):(\d{0,2}):(\d{0,2})$/);
if (a == null) return false;
if ( a[2]>=13 || a[3]>=32 || a[4]>=24 || a[5]>=60 || a[6]>=60) return false;
return true;
}

function validate(obj,type){
var range=obj.createTextRange();
var text = range.text;
var selrange = document.selection.createRange();
var seltext = selrange.text;
var startpos = 0,endpos = 0;
while(selrange.compareEndPoints("StartToStart",range)>0){
selrange.moveStart("character",-1);
startpos ++;
}
while(selrange.compareEndPoints("EndToStart",range)>0){
selrange.moveEnd("character",-1);
endpos ++;
}
if(event.keyCode>=48){
var keytext = String.fromCharCode(event.keyCode);
text = text.substring(0,startpos) + keytext + text.substring(endpos,text.length);
}else if(event.keyCode == 46){//delete
if(startpos == endpos)text = text.substring(0,startpos) + text.substring

(startpos+1,text.length);
else text = text.substring(0,startpos) + text.substring(endpos,text.length);
}else if(event.keyCode ==8){
if(startpos == endpos)text = text.substring(0,startpos-1) + text.substring

(startpos,text.length);
else text = text.substring(0,startpos) + text.substring(endpos,text.length);
}
if(event.keyCode == 45){
event.returnValue = false;
return;
}
var valid;
switch(type){
case 3:valid = isDateTime(text);break;
default:valid = false;
}
if(!valid){
event.returnValue = false;
}
}
</script>
把上面这段代码放在web页面的任何位置即可。
使用方法：
<br>

日期时间验证框：<br><input onkeyDown="validate(this,3)" value="0000-00-00 00:00:00"> <br>

我们可以测试一下。
在页面上加入以下内容：<br>
<input id="date" οnkeydοwn="validate(this,3)" value=<script>date()</script>><br>
然后你可以尝试向这个输入框内输入任何内容，看看效果如何吧。
</HEAD>

<BODY>
<form method="post" action="">
<div>

</div>
</form>
</BODY>
</HTML>