JavaScript中的日期处理注意事项
在业务逻辑比较多的系统里面,一般都会涉及到日期的处理。包括选择起始日期和结束日期,结束日期要大于起始日期,日期的显示和输入等。
输入这一块基本都是使用jQuery datetimepicker,后来系统使用Bootstrap,就开始使用bootstrap datetimepicker。不过功能都差不多。
1.日期录入控件
<html>
<head>
<meta charset="utf-8"/>
<title>日期输入</title>
<link rel="stylesheet" href="datepicker.css"/>
<link rel="stylesheet" href="datepicker3.css"/>
</head>
<body>
<div id="sandbox-container">
<div>
<label for="startdate">起始日期:</label>
<input id="startdate" type="text" type="text" class="form-control">
</div>
</div>
<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="base.js"></script>
<script type="text/javascript" src="bootstrap-datepicker.js"></script>
<script type="text/javascript" src="bootstrap-datepicker.zh-CN.js"></script>
<script type="text/javascript">
$('#startdate').datepicker({
language:"zh-CN",
autoclose: true,
todayHighlight: true
}).on("hide",function(e){
var start = new Date($("#startdate").val());
start = maxDate(start, new Date());
console.log("最大的日期:"+start);
});
/*
$('#enddate').datepicker({
language:"zh-CN",
autoclose: true,
todayHighlight: true
});
*/
$(document).ready(function(){
});
</script>
</body>
</html>
.csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; }
2.因为bootstrap-datetimepicker项目不支持Time选择,所以国内有团队做了扩展,参考地址:http://www.bootcss.com/p/bootstrap-datetimepicker/。
3.处理含有time日期格式时间的显示
ISO 格式是 ISO 8601 扩展格式的简化形式。 格式如下所示:YYYY-MM-DDTHH:mm:ss.sssZ。但是实际项目中我们存储的时间格式一般是:2014-04-18 18:52:05,这种格式。但是这种使用Date对象不能直接操作,所以我们在项目中需要自己写一个格式化的函数,对这种日期格式进行转换。网上和前期项目中使用的格式化函数如下:
//将日期转换为字符串
//epoch值转换为指定格式的日期字符串
Date.prototype.toFormat=function(format){
var o={
"M+":this.getMonth()+1,
"d+":this.getDate(),
"H+":this.getHours(),
"m+":this.getMinutes(),
"s+":this.getSeconds(),
"S":this.getMilliseconds(),
}
if(/(y+)/.test(format)){
format=format.replace(RegExp.$1,(this.getFullYear().toString()).substr(4-RegExp.$1.length));
for(var k in o){
if(new RegExp("("+k+")").test(format)){
format=format.replace(RegExp.$1,
RegExp.$1.length==1?o[k]:("00"+o[k]).substr((""+o[k]).length));
}
}
}
return format;
}
.csharpcode, .csharpcode pre { font-size: small; color: black; font-family: consolas, "Courier New", courier, monospace; background-color: #ffffff; /*white-space: pre;*/ } .csharpcode pre { margin: 0em; } .csharpcode .rem { color: #008000; } .csharpcode .kwrd { color: #0000ff; } .csharpcode .str { color: #006080; } .csharpcode .op { color: #0000c0; } .csharpcode .preproc { color: #cc6633; } .csharpcode .asp { background-color: #ffff00; } .csharpcode .html { color: #800000; } .csharpcode .attr { color: #ff0000; } .csharpcode .alt { background-color: #f4f4f4; width: 100%; margin: 0em; } .csharpcode .lnum { color: #606060; }
参考网址:
正则表达式格式化日期:http://www.cnblogs.com/oneivan/p/3671992.html
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- [干货]再见,Android JNI 封装
- Redis如何让你加到了附近的人
- JVM调优调的是什么?是寂寞吗?
- 如何做攻击溯源自动化
- Java多线程相关知识点扩展实例分析
- 巧用 Nsenter 调取宿主机工具调试容器内程序
- 如何在 Kubernetes 集群中集成 Kata
- Pytest实战
- Native 与 Weex 交互通用解决方案
- 20个MySQL运维案例,请查收!
- Unity3D中使用Joystick Pack实现摇杆控制
- Unity3D使用Timeline实现过场动画
- Oracle中ascii为0的陷阱
- VBA解析VBAProject 05——提取模块代码
- VBA解析VBAProject 06——清除VBA工程密码