JS检查日期有效性

最新推荐文章于 2023-09-18 09:22:02 发布

初冬十月

最新推荐文章于 2023-09-18 09:22:02 发布

阅读量4.4k

点赞数

分类专栏：网页制作文章标签： JQ JS 日期

本文链接：https://blog.csdn.net/mammay/article/details/17333639

版权

网页制作专栏收录该内容

1 篇文章 0 订阅

订阅专栏

最近，在跟一个项目，涉及到填写日期是否正确有效的问题。（PS，这个问题很重要，涉及数据库方面...具体的就不说了...）
虽然我可以限制用户只能使用日期控件填写日期，但是，我发现，这个日期控件好像不是万能的，在某些浏览器根本用不了...
哎~还是采用最原始的方法好了~~以下是我自己写的代码，暂时没发现什么问题，跟大伙分享下哈~
<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>CheckDateFormat</title>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript">
/*
*参数
* reg：正则表达式
* str:要检查的字符串
*功能
* 检查str是否满足reg格式
*返回值
* true或者false
*/
function testReg(reg, str) {
//RegExpObject.test(string)用于检测一个字符串是否匹配某个模式.
return reg.test(str);
}

/*
*参数
* dateStr：客户端输入的日期字符串
*功能
* 检查dateStr日期格式是否正确
*返回值
* true或者false
*/
function checkDateFormat(dateStr) {
var regDateFormat1 = /^\d{4}-\d{1,2}-\d{1,2}$/;
var regDateFormat2 = /^\d{4}\/\d{1,2}\/\d{1,2}$/;
var regDateFormat3 = /^\d{4}\.\d{1,2}\.\d{1,2}$/;
if (!testReg(regDateFormat1, dateStr)) { //调用testReg函数
if (!testReg(regDateFormat2, dateStr)) { //调用testReg函数
if (!testReg(regDateFormat3, dateStr)) { //调用testReg函数
return false;
}
else {
return true;
}
}
else {
return true;
}
}
else {
return true;
}
}

/*
*参数
* dateStr：客户端输入的日期字符串
*功能
* 检查dateStr日期是否有效（年、月、日是否有效），分闰年、平年、大月、小月考虑
*返回值
* true或者false
*/
function checkDateValid(dateStr) {
//stringObject.indexOf(searchvalue,fromindex)返回某个指定的字符串值在字符串中首次出现的位置。如果要检索的字符串值没有出现，则该方法返回 -1。
var sepa1 = dateStr.indexOf("-");
var sepa2 = dateStr.indexOf("/");
var sepa3 = dateStr.indexOf(".");
var sepa = "";
if (sepa1 > -1) {
sepa = "-";
}
else if (sepa2 > -1) {
sepa = "/";
}
else if (sepa3 > -1) {
sepa = ".";
}
//stringObject.split(separator, howmany)把一个字符串分割成字符串数组。
var arrDate = dateStr.split(sepa);
var year = parseInt(arrDate[0]);
var month = parseInt(arrDate[1]);
var day = parseInt(arrDate[2]);
/*
* datetime数据类型在MS SQL Server 取值范围是1753-1-1到9999-12-31
*
* if 西元年份是400的倍数 : 闰年
else if 西元年份是4的倍数 and 西元年份不是100的倍数 : 闰年
else : 平年
*
* 2月：平年为28天，闰年为29天
30天的月份：4、6、9、11
31天的月份：1、3、5、7、8、10、12
*
*/

if (year < 1753 || year > 9999 || month < 1 || month > 12 || day < 1 || day > 31) {
//alert("1");
return false;
}
else {
if (year % 400 == 0 || (year % 4 == 0 && year % 100 != 0)) { //闰年
//alert("2");
if ((month == 2 && day > 29) || ((month == 4 || month == 6 || month == 9 || month == 11) && day > 30) || ((month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12) && day > 31)) {
//alert("3");
return false;
}
else {
//alert("4");
return true;
}
}
else { //平年
//alert("5");
if ((month == 2 && day > 28) || ((month == 4 || month == 6 || month == 9 || month == 11) && day > 30) || ((month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12) && day > 31)) {
//alert("6");
return false;
}
else {
//alert("7");
return true;
}
}
}
}

$(function () {
//日期框失去焦点时触发
$("#date").blur(function () {
var $dateVal = $(this).val();
var dateErrMsg = "";
if ($dateVal == "") {
dateErrMsg = "日期不能为空！";
//alert(dateErrMsg);
$("#lableDateErrMsg").html(dateErrMsg);
$date.focus();
return false;
}
else if ($dateVal.length < 8) {
dateErrMsg = "日期位数不能少于8位！";
//alert(dateErrMsg);
$("#lableDateErrMsg").html(dateErrMsg);
$date.focus();
return false;
}
else {
if (!checkDateFormat($dateVal)) { //调用checkDateFormat函数
dateErrMsg = "日期格式不正确！(正确格式如“yyyy-mm-dd”或者“yyyy/mm/dd”或者“yyyy.mm.dd”）";
//alert(dateErrMsg);
$("#lableDateErrMsg").html(dateErrMsg);
$date.focus();
return false;
}
else {
if (!checkDateValid($dateVal)) { //调用checkDateValid函数
dateErrMsg = "日期无效!（日期范围是1753-1-1到9999-12-31。30天的月份：4、6、9、11；31天的月份：1、3、5、7、8、10、12；2月：平年为28天，闰年为29天）";
//alert(dateErrMsg);
$("#lableDateErrMsg").html(dateErrMsg);
$date.focus();
return false;
}
else {
dateErrMsg = "";
//alert(dateErrMsg);
$("#lableDateErrMsg").html(dateErrMsg);
}
}
}
});

//单击“检查日期”按钮时触发
// $("#submit").click(function () {
// var $date = $("#date");
// var $dateVal = $date.val();
// var dateErrMsg = "";
// if ($dateVal == "") {
// dateErrMsg = "日期不能为空！";
// //alert(dateErrMsg);
// $("#lableDateErrMsg").html(dateErrMsg);
// $date.focus();
// return false;
// }
// else if ($dateVal.length < 8) {
// dateErrMsg = "日期位数不能少于8位！";
// //alert(dateErrMsg);
// $("#lableDateErrMsg").html(dateErrMsg);
// $date.focus();
// return false;
// }
// else {
// if (!checkDateFormat($dateVal)) { //调用checkDateFormat函数
// dateErrMsg = "日期格式不正确！(正确格式如“yyyy-mm-dd”或者“yyyy/mm/dd”或者“yyyy.mm.dd”）";
// //alert(dateErrMsg);
// $("#lableDateErrMsg").html(dateErrMsg);
// $date.focus();
// return false;
// }
// else {
// if (!checkDateValid($dateVal)) { //调用checkDateValid函数
// dateErrMsg = "日期无效!（日期范围是1753-1-1到9999-12-31。30天的月份：4、6、9、11；31天的月份：1、3、5、7、8、10、12；2月：平年为28天，闰年为29天）";
// //alert(dateErrMsg);
// $("#lableDateErrMsg").html(dateErrMsg);
// $date.focus();
// return false;
// }
// else {
// dateErrMsg = "";
// //alert(dateErrMsg);
// $("#lableDateErrMsg").html(dateErrMsg);
// }
// }
// }
// });

});
</script>
<style type="text/css">
#lableDateErrMsg {
color:red;
font-size:12px;
}
</style>
</head>
<body>
<label id="labelDate">日期：</label><input type="text" id="date" name="date" maxlength="10" /><label id="lableDateErrMsg"></label><br />

</body>
</html>

PS：欢迎留言！欢迎指出错误！欢迎帮我优化！哈哈~~

初冬十月

关注

0
点赞
踩
5

收藏

觉得还不错? 一键收藏
0
评论
JS检查日期有效性

最近，在跟一个项目，涉及到填写日期是否正确有效的问题。（PS，这个问题很重要，涉及数据库方面...具体的就不说了...）虽然我可以限制用户只能使用日期控件填写日期，但是，我发现，这个日期控件好像不是万能的，在某些浏览器根本用不了...哎~还是采用最原始的方法好了~~以下是我自己写的代码，暂时没发现什么问题，跟大伙分享下哈~ CheckDateFor
复制链接

扫一扫