高效JavaScript日期验证代码示例
下载需积分: 9 | 4KB |
更新于2025-01-20
| 167 浏览量 | 举报
收藏
立即下载 这段代码提供了一个在JavaScript中实现日期验证的强大工具，特别是在处理日期格式方面。标题"超级好用的日期验证代码JAVASCRIPT"表明它专注于JavaScript编程中的日期有效性检查，对于确保用户输入或系统内部使用的日期符合特定格式非常重要。
代码的核心是`checkDate`函数，它接受一个字符串参数`strDate`，并使用正则表达式`/^(\d{4})([-])(\d{2})([-])(\d{2})/`来匹配输入的日期，该正则表达式用于检查日期是否符合"yyyy-MM-dd"的格式，其中年份、月份和日期都是两位数字。如果不符合，函数会弹出错误消息并返回`false`。
`checkDate`函数首先通过`split`方法将输入的字符串按"-"拆分成年、月、日三个部分，并分别存储在`year`、`month`和`date`变量中。接下来，函数分别调用`checkYear`、`checkMonth`和`checkDate`这三个辅助函数来验证各个部分的有效性。
`checkYear`函数用于检查年份，它首先判断输入的年份是否能转换为整数，如果不是或者年份小于1950或大于2050，函数会给出相应的错误提示并返回`false`；否则返回`true`。
`checkMonth`函数负责验证月份，它检查输入的月份是否在1到12的范围内，同时排除了非标准的月份范围（如3月31日），如果不符合条件则返回`false`。
`checkDate`函数的最后一步是调用`checkDate(year, month, date)`，这可能是一个更具体的子函数，用来检查给定年份和月份下的日期是否有效。具体来说，它可能会检查2月的天数（考虑到闰年），以及其他月份的天数限制。
整个过程非常细致，确保了输入的日期不仅格式正确，而且符合实际存在的日期范围。这对于开发Web应用程序、处理用户输入、生成报表或其他需要日期验证的场景都非常实用。开发者可以通过集成这段代码轻松地在JavaScript项目中提升日期验证的准确性和用户体验。
相关推荐
我现在就负责把管理员模块前端完善好，你告诉我我怎么做，以下是我现有的管理员模块代码addminadd.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
管理员管理
</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<script type="text/javascript" src="lib/loading/okLoading.js"></script>
<link rel="stylesheet" href="css/main.css" media="all">
</head>
<style>
.imgs{display: none;}
.picture{display: none;}
</style>
<body>
<form class="layui-form" id="adminadd">
<input type="hidden" name="id" value="">
<label for="username" class="layui-form-label">
*登录名
</label>
<input type="text" id="name" name="name" required="" lay-verify="required"
autocomplete="off" class="layui-input" value="">
*将会成为您唯一的登入名
<label for="phone" class="layui-form-label">
*手机
</label>
<input type="text" id="phone" name="phone" required="" lay-verify="phone"
autocomplete="off" class="layui-input" value="">
*将会成为您唯一的登入名
<label for="role" class="layui-form-label">
*用户组
</label>
<select name="group_id">
<option value="">请选择角色</option>
<option value="1" >超级管理员</option>
</select>
<label for="link" class="layui-form-label">
*缩略图
</label>
<button type="button" class="layui-btn" id="test1">
上传图片
</button>
<input class="layui-upload" type="file" accept="undefined" id="previewImg" name="img" onchange="upload(this,)">
ဂ撤销上传
<label class="layui-form-label">缩略图展示
</label>
![]()
<input id="avatar" name="image" required="" type="hidden" value="">
<label for="L_pass" class="layui-form-label">
*密码
</label>
<input type="password" id="L_pass" name="password" required="" lay-verify="pass"
autocomplete="off" class="layui-input" value="">
6到16个字符
<label for="L_repass" class="layui-form-label">
*确认密码
</label>
<input type="password" id="L_repass" name="repass" required="" lay-verify="repass"
autocomplete="off" class="layui-input">
<label class="layui-form-label">状态</label>
<input type="radio" name="status" value="1" title="启用" checked="checked">
启用
<input type="radio" name="status" value="0" title="禁用" checked="checked">
禁用
<label for="L_repass" class="layui-form-label">
</label>
<button class="layui-btn" lay-filter="add" lay-submit="">
增加
</button>
</form>
<script src="lib/layui/layui.js" charset="utf-8">
</script>
<script src="js/x-layui.js" charset="utf-8">
</script>
<script>
layui.use(['form','layer'], function(){
$ = layui.jquery;
var form = layui.form()
,layer = layui.layer;
okLoading.close($);
//自定义验证规则
/*form.verify({
nikename: function(value){
if(value.length < 5){
return '昵称至少得5个字符啊';
}
}
,pass: [/(.+){6,12}$/, '密码必须6到12位']
,repass: function(value){
if($('#L_pass').val()!=$('#L_repass').val()){
return '两次密码不一致';
}
}
});*/
//监听提交
form.on('submit(add)', function(data){
var admindate=$("#adminadd").serialize();
//var data = data.field;
$.ajax({
type:'post',
url:"xxx",
data:admindate,
datatype:"json",
success:function (data) {
if(data.status==1){
layer.msg(data.info,{icon:1,time:1000});
setTimeout(function(){
window.parent.location.reload();
var index = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
},1000);
return false;
}else{
layer.msg(data.info,{icon:5,time:2000});return false;
}
}
})
return false;
});
});
</script>
<script>
//轮播图上传
function upload(obj,id)
{
var formData = new FormData();
formData.append('img', $('#previewImg')[0].files[0]);
formData.append('id', id);//将id追加再id中
layer.msg('图片上传中', {icon: 16});
$.ajax({
type:"post",
processData: false,
contentType: false,
url:"xxx",
data:formData,
success:function(data){
if(data.status == 1){
//console.log(data.image_name);
layer.closeAll('loading');
//layer.msg(data.info,{icon:1,time:1000});
$("#pimages").attr('src',data.image_name);
$("#avatar").val(data.image_name);
$(".imgs").show();
return false;
}else{
layer.msg(data.info,{icon:2,time:1000});
}
}
});
}
</script>
</body>
</html> 和adminlist.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>
管理员列表
</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<script type="text/javascript" src="lib/loading/okLoading.js"></script>
<link rel="stylesheet" href="css/main.css" media="all">
<link rel="stylesheet" href="css/bootstrap.css">
</head>
<body>
<form class="layui-form x-center" action="" style="width:80%">
<label class="layui-form-label">日期范围</label>
<input class="layui-input" placeholder="开始日" id="LAY_demorange_s">
<input class="layui-input" placeholder="截止日" id="LAY_demorange_e">
<input type="text" name="username" placeholder="请输入登录名" autocomplete="off" class="layui-input">
<button class="layui-btn" lay-submit="" lay-filter="sreach"></button>
</form>
<xblock>
<button class="layui-btn layui-btn-danger" onclick="delAll()">批量删除</button>
<button class="layui-btn" onclick="admin_add('添加用户','adminadd.html','600','500')">添加</button>
共有数据：88 条
</xblock>
<input type="checkbox" name="" value="">
ID
登录名
手机
邮箱
角色
加入时间
状态
操作
<input type="checkbox" value="1" name="">
1
admin
1111111111
[email protected]
1970-01-01 08:00:00
启用
<input type="checkbox" value="1" name="">
2
admin1
1111111111
[email protected]
超级管理员
1970-01-01 08:00:00
启用
<input type="checkbox" value="1" name="">
3
admin2
11111111
[email protected]
超级管理员
1970-01-01 08:00:00
启用
<input type="checkbox" value="1" name="">
4
admin
1111111111
[email protected]
2019-07-20 17:03:28
启用
<input type="checkbox" value="1" name="">
5
admin
11111111
[email protected]
2019-07-20 17:03:41
启用
<script src="lib/layui/layui.js" charset="utf-8"></script>
<script src="js/x-layui.js" charset="utf-8"></script>
<script>
layui.use(['laydate','element','laypage','layer'], function(){
$ = layui.jquery;//jquery
laydate = layui.laydate;//日期插件
lement = layui.element();//面包导航
laypage = layui.laypage;//分页
layer = layui.layer;//弹出层
okLoading.close($);
//以上模块根据需要引入
/*laypage({
cont: 'page'
,pages: 100
,first: 1
,last: 100
,prev: '<'
,next: '>'
}); */
var start = {
min: laydate.now()
,max: '2099-06-16 23:59:59'
,istoday: false
,choose: function(datas){
end.min = datas; //开始日选好后，重置结束日的最小日期
end.start = datas //将结束日的初始值设定为开始日
}
};
var end = {
min: laydate.now()
,max: '2099-06-16 23:59:59'
,istoday: false
,choose: function(datas){
start.max = datas; //结束日选好后，重置开始日的最大日期
}
};
document.getElementById('LAY_demorange_s').onclick = function(){
start.elem = this;
laydate(start);
}
document.getElementById('LAY_demorange_e').onclick = function(){
end.elem = this
laydate(end);
}
});
//批量删除提交
function delAll () {
layer.confirm('确认要删除吗？',function(index){
//捉到所有被选中的，发异步进行删除
layer.msg('删除成功', {icon: 1});
});
}
/*添加*/
function admin_add(title,url,w,h){
x_admin_show(title,url,w,h);
}
/*停用*/
function admin_stop(obj,id,e){
layer.confirm(e==1?'你确定要启用吗？':'你确定要禁用吗？',{icon: 3, title:'提示'},function(index){
$.ajax({
type:"post",
url:"xxx",
data:{id:id,status:e},
dataType:"json",
success:function(data)
{
if(data.status==1){
//发异步把用户状态进行更改
$(obj).attr("class","layui-btn layui-btn-danger ");
$(obj).text("隐藏");
$(obj).remove();
layer.msg(data.info,{icon: 6,time:1000});
setTimeout(function(){
window.location.reload();
},1000);return false;
}else{
//发异步把用户状态进行更改
$(obj).attr("class","layui-btn layui-btn-normal ");
$(obj).text("显示");
$(obj).remove();
layer.msg(data.info,{icon: 5,time:1000});return false;
}
}
});
});
}
/*启用*/
function admin_start(obj,id){
layer.confirm('确认要启用吗？',function(index){
//发异步把用户状态进行更改
$(obj).parents("tr").find(".td-manage").prepend('');
$(obj).parents("tr").find(".td-status").html('已启用');
$(obj).remove();
layer.msg('已启用!',{icon: 6,time:1000});
});
}
//编辑
function admin_edit (title,url,id,w,h) {
url = url+"?id="+id;
x_admin_show(title,url,w,h);
}
/*删除*/
function admin_del(obj,id){
layer.confirm('确认要删除吗？',function(index){
//发异步删除数据
$(obj).parents("tr").remove();
layer.msg('已删除!',{icon:1,time:1000});
});
}
</script>
</body>
</html>，这是我的admin.js:// js/admin.js
const AdminManager = {
// 获取所有管理员
getAll: function() {
return JSON.parse(localStorage.getItem('admins')) || [];
},
// 保存所有管理员
saveAll: function(admins) {
localStorage.setItem('admins', JSON.stringify(admins));
},
// 获取单个管理员
getById: function(id) {
return this.getAll().find(item => item.id == id);
},
// 添加或更新管理员
save: function(admin) {
let admins = this.getAll();
if (admin.id) {
// 更新
const index = admins.findIndex(a => a.id == admin.id);
if (index !== -1) {
admins[index] = admin;
}
} else {
// 新增
admin.id = this.generateId();
admin.create_time = new Date().toLocaleString();
admins.push(admin);
}
this.saveAll(admins);
return admin;
},
// 删除管理员
delete: function(id) {
let admins = this.getAll().filter(a => a.id != id);
this.saveAll(admins);
},
// 生成ID
generateId: function() {
const admins = this.getAll();
return admins.length > 0 ? Math.max(...admins.map(a => a.id)) + 1 : 1;
}
}现在的问题是运行出来界面添加删除按钮点了没反应，我现在只需要弄好前端不需要和后端交互，添加的信息存本地就行先不连数据库，请你帮我解决一下，并且一定要给我完整的修改后的代码，
<label for="username" class="layui-form-label">
*登录名
</label>
<input type="text" id="name" name="name" required="" lay-verify="required"
autocomplete="off" class="layui-input" value="">
*将会成为您唯一的登入名
<label for="phone" class="layui-form-label">
*手机
</label>
<input type="text" id="phone" name="phone" required="" lay-verify="phone"
autocomplete="off" class="layui-input" value="">
*将会成为您唯一的登入名
<label for="role" class="layui-form-label">
*用户组
</label>
<select name="group_id">
<option value="">请选择角色</option>
<option value="1" >超级管理员</option>
</select>
<label for="link" class="layui-form-label">
*缩略图
</label>
ဂ撤销上传
<button type="button" class="layui-btn" id="test1">
上传图片
</button>
<input class="layui-upload" type="file" accept="undefined" id="previewImg" name="img" onchange="upload(this,)">
<label class="layui-form-label">缩略图展示
</label>
![]()
<input id="avatar" name="image" required="" type="hidden" value="">
<label for="L_pass" class="layui-form-label">
*密码
</label>
<input type="password" id="L_pass" name="password" required="" lay-verify="pass"
autocomplete="off" class="layui-input" value="">
6到16个字符
<label for="L_repass" class="layui-form-label">
*确认密码
</label>
<input type="password" id="L_repass" name="repass" required="" lay-verify="repass"
autocomplete="off" class="layui-input">
<label class="layui-form-label">状态</label>
<input type="radio" name="status" value="1" title="启用" checked="checked">
<input type="radio" name="status" value="0" title="禁用" checked="checked">
启用
禁用
<label for="L_repass" class="layui-form-label">
</label>
<button class="layui-btn" lay-filter="add" lay-submit="">
增加
</button>
</form>
<label class="layui-form-label">日期范围</label>
<input class="layui-input" placeholder="开始日" id="LAY_demorange_s">
<input class="layui-input" placeholder="截止日" id="LAY_demorange_e">
<input type="text" name="username" placeholder="请输入登录名" autocomplete="off" class="layui-input">
<button class="layui-btn" lay-submit="" lay-filter="sreach"></button>
| <input type="checkbox" name="" value=""> | ID | 登录名 | 手机 | 邮箱 | 角色 | 加入时间 | 状态 | 操作 |
|---|---|---|---|---|---|---|---|---|
| <input type="checkbox" value="1" name=""> | 1 | admin | 1111111111 | [email protected] | 1970-01-01 08:00:00 | 启用 | | |
| <input type="checkbox" value="1" name=""> | 2 | admin1 | 1111111111 | [email protected] | 超级管理员 | 1970-01-01 08:00:00 | 启用 | |
| <input type="checkbox" value="1" name=""> | 3 | admin2 | 11111111 | [email protected] | 超级管理员 | 1970-01-01 08:00:00 | 启用 | |
| <input type="checkbox" value="1" name=""> | 4 | admin | 1111111111 | [email protected] | 2019-07-20 17:03:28 | 启用 | | |
| <input type="checkbox" value="1" name=""> | 5 | admin | 11111111 | [email protected] | 2019-07-20 17:03:41 | 启用 | |
hhq123456789hhq
- 粉丝: 1
我的内容管理
展开
最新资源
- TCPIP心跳包技术细节与项目应用分析
- VideoDownloadHelper浏览器插件安装与使用指南
- 深度学习驱动的中文语音识别系统快速部署
- 深入解析Static关键字在编程中的应用
- 深入探索Quartz定时任务框架
- HTML5 Canvas特效实现：蛟龙动画源码解析
- 亚太赛E题数据增强：GDP与工业生产值分析
- 数字逻辑实验全面指南：报告、软件与电路图
- 掌握Docker实训课程：从Dockerfile入门到实践
- 综合测试复习范围压缩文件解析
- 深入解析littleVGLv6.0：界面开发利器
- Ass1Q1压缩包文件内容解析
- 案例注册流程详解及压缩包使用指南
- K8s环境下的MLflow模型服务部署指南
- 搭建End to End区块链网络的Fabric完整文件指南
- Kubernetes pause-3.4.1压缩包下载指南
- Java实现的远程路灯控制与环境信息采集系统
- Kubernetes kube-controllers组件下载指南
- 小程序英文电子词典开发教程与源码分享
- Kubernetes v1.21: CNI v3.19.4镜像包下载指南
- 小程序电话状态监听功能实现指南
- Kubernetes 1.21版本镜像包下载指南
- Docker环境下的Jdk与jar包测试文件打包教程
- MATLAB分数模糊推理系统在倒立摆控制的应用教程
