要確保用戶輸入日期的有效性,首先要驗證用戶輸入的日期是否合法,以此來有效提高程序的執行速度,在這個例子中文本框輸入“2017-02-29”,單擊“提交”按鈕后,將實現驗證日期
需要注意一下幾點:
1.首先需要從輸入的字符串中提取出年份,月份和日;並判斷輸入的年份,月份和日份是否大於0的數字,然后將月份和日中小於10的數字格式化為長度為2的字符串(在其前面填充0)。
2.將提取並格式化后的年份,月份和日重新組合,使其組合為“YYYY-MM-DD”格式的字符串,並判斷新組合的字符串長度是否為10.
3.判斷輸入年份是否為閏年,從而判斷2月份的天數(判斷輸入的年份是否為閏年,從而判斷2月份的天數)。
4.根據1,3,5,7,8,10,12月份為31天,其他月份為30天的原則,判斷除2月份以外的月份的天數是否正確。
5.判斷月份是否大於12
其中還應用了正則表達式來判斷日期的基本格式,正則表達式語法如下:/(\d{4}-)(\d{2}-)(\d{2})$/;
應用JavaScript編寫驗證碼輸入的日期格式是否正確的checkdata()代碼如下:
<script>
// 判斷輸入的日期是否正確
function checkdata(data){
if(data==""){
return true;
}
subYY=data.substr(0,4)
if(isNaN(subYY)||subYY<=0){
return true;
}
// 轉換月份
if(data.indexOf('-',0)!=-1){
separate="-"
}else{
return true;
}
area=data.indexOf(separate,0)
subMM=data.substr(area+1,data.indexOf(separate,area+1)-(area+1))
if(isNaN(subMM)||subMM<=0){
return true;
}
if(subMM.length<2){
subMM="0"+subMM
}
// 轉換日
area=data.lastIndexOf(separate)
subDD=data.substr(area+1,data.length-area-1)
if(isNaN(subDD)||subDD<=0){
return true;
}
if(eval(subDD<10)){
subDD="0"+eval(subDD)
}
NewDate=subYY+"-"+subMM+"-"+subDD
// alert(NewDate);
if(NewDate.length!=10){
return true;
}
if(NewDate.substr(4,1)!="-"){
return true;
}
if(NewDate.substr(7,1)!="-"){
return true;
}
var MM=NewDate.substr(5,2);
var DD=NewDate.substr(8,2);
if((subYY%4==0&&subYY%100!=0)||subYY%400==0){//判斷是否為閏年
if(parseInt(MM)==2){//閏年的二月份
if(DD>29){
return true;
}
}
}else{
if(parseInt(MM)==2){//非閏年的二月份
if(DD>28){
return true;
}
}
}
var mm=new Array(4,6,9,11);//判斷每月中最大天數是30或者31
for(i=0;i<mm.length;i++){
if(parseInt(MM)==mm[i]){
if(parseInt(DD)>30){
return true;
}
}else{
if(parseInt(DD)>31){
return true;
}
}
}if(parseInt(MM)>12){
return true;
}
return false;
}
應用JavaScript腳本編寫一個checkdata函數,並通過正則表達式驗證用戶輸入的日期格式是否正確
function checkdata1(data){
var str=data;
// 在JavaScript中正則表達式只能通過使用"/"開頭和結束,不能使用雙引號
// 匹配字符串中的指定位數,(\d{2}$表明以兩個數字結尾
var expression=/(\d{4}-)(\d{2}-)(\d{2})$/;
var objExp=new RegExp(expression);
if(objExp.test(str)==true){
return true;
}else{
return false;
}
}
編寫自定義的JavaScript函數check(),用於在提交表單前判斷用戶輸入是否合法,在該函數中再調用checkdata()和checkdata1,判斷輸入的日期是否正確,如果不正確則給予提示,否則提交表單。
function check(){
if(form.data.value==""){
alert("請輸入正確的日期");
form.data.focus();return false;
}
if(!checkdata1(form.data.value)||form.data.value.length!=10){
alert("你輸入的基本格式不對");
form.data.focus();return false;
}
if(checkdata(form.data.value)){
alert("你輸入的日期不正確(如:1920-07-17)\n 請注意閏年!");
form.data.focus();
return false;
}
}
</script>
最后是輸入框
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<form action="" name="form" onsubmit="return check()">
<input type="text" name="data">
<input type="submit" name="submit" value="提交">
<input type="reset" name="reset" value="重置">
</form>
</body>
</html>
