一、日期控件datebox
原文链接：
http://blog.csdn.net/walkerjong/article/details/7530709
http://www.cnblogs.com/yechun/archive/2012/03/18/2404381.html
基本用法：
1） 加入日期选择框
$("#dd").datebox({"required":true});
2） javascript获取日期选择框的值
$("#dd").datebox("getValue"); 或者$("input[name='dd']").val();
那么我们可以给它添加一个事件监听，在datebox onSelect 日期选中后，自动为input id="dd" type="text"赋值，然后我们就可以使用
$("#dd").val()获取选中的日期值了。
<script type="text/javascript"> $(document).ready(function(){ $("#dd").datebox({ required:true, onSelect: function(date){ $("#dd").val(date); } }); }); </script>
3） javascript设置datebox的值
$("#dd").datebox("setValue", "2012-01-01");
例：添加编辑页面
@Html.Hidden("hBirthDate", Model.BirthDate.ToString("yyyy-MM-dd"))
$(document).ready(function () { $("#BirthDate").datebox({ required: false, formatter: function (date) { return date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate(); }, parser: function (date) { return new Date(Date.parse(date.replace(/-/g, "/"))); }, onSelect: function (date) { $("#BirthDate").val(date); } }); //处理日期格式问题 if ($("#hBirthDate").val() != "" && $("#hBirthDate").val() != "0001-01-01") { $("#BirthDate").datebox("setValue", $("#hBirthDate").val()); } else { $("#BirthDate").datebox("setValue", ((new Date()).getFullYear() - 25) + "-01-01"); } });
二、时间控件datetimebox
用法和日期控件类似
实现开始日期和结束日期的判断和赋值
绑定脚本：
<script type="text/javascript"> $(document).ready(function(){ $("#StartDT").datetimebox({ required: false, formatter: function (date) { var y = date.getFullYear(); var m = date.getMonth() + 1; var d = date.getDate(); var hh = date.getHours(); var mm = date.getMinutes(); var ss = date.getSeconds(); return y + '-' + (m < 10 ? ('0' + m) : m) + '-' + (d < 10 ? ('0' + d) : d) + ' ' + (hh < 10 ? ('0' + hh) : hh) + ':' + (mm < 10 ? ('0' + mm) : mm) + ':' + (ss < 10 ? ('0' + ss) : ss); }, parser: function (date) { return new Date(Date.parse(date.replace(/-/g, "/"))); }, onSelect: function (date) { $("#StartDT").val(date); var startDate = date; var endDate = $('#EndDT').val(); if ((new Date(startDate)).dateDiff(endDate) > 0) { var y = date.getFullYear(); var m = date.getMonth() + 1; var d = date.getDate(); var hh = date.getHours(); var mm = date.getMinutes(); var ss = date.getSeconds(); var dateStr = y + '-' + (m < 10 ? ('0' + m) : m) + '-' + (d < 10 ? ('0' + d) : d) + ' ' + (hh < 10 ? ('0' + hh) : hh) + ':' + (mm < 10 ? ('0' + mm) : mm) + ':' + (ss < 10 ? ('0' + ss) : ss); $("#EndDT").datetimebox('setValue', dateStr); } } }); $("#EndDT").datetimebox({ required: false, formatter: function (date) { var y = date.getFullYear(); var m = date.getMonth() + 1; var d = date.getDate(); var hh = date.getHours(); var mm = date.getMinutes(); var ss = date.getSeconds(); return y + '-' + (m < 10 ? ('0' + m) : m) + '-' + (d < 10 ? ('0' + d) : d) + ' ' + (hh < 10 ? ('0' + hh) : hh) + ':' + (mm < 10 ? ('0' + mm) : mm) + ':' + (ss < 10 ? ('0' + ss) : ss); }, parser: function (date) { return new Date(Date.parse(date.replace(/-/g, "/"))); }, onSelect: function (date) { $("#EndDT").val(date); var startDate = $("#StartDT").val(); var endDate = date; if ((new Date(startDate)).dateDiff(endDate) > 0) { var y = date.getFullYear(); var m = date.getMonth() + 1; var d = date.getDate(); var hh = date.getHours(); var mm = date.getMinutes(); var ss = date.getSeconds(); var dateStr = y + '-' + (m < 10 ? ('0' + m) : m) + '-' + (d < 10 ? ('0' + d) : d) + ' ' + (hh < 10 ? ('0' + hh) : hh) + ':' + (mm < 10 ? ('0' + mm) : mm) + ':' + (ss < 10 ? ('0' + ss) : ss); $("#StartDT").datetimebox('setValue', dateStr); } } }); //时间赋值
if ($("#ModelStartDT").val() != "") { $("#StartDT").datetimebox("setValue", $("#ModelStartDT").val()); } if ($("#ModelEndDT").val() != "") { $("#EndDT").datetimebox("setValue", $("#ModelEndDT").val()); } }); </script>
使用的自定义方法dateDiff
可参考http://www.cnblogs.com/xcsn/p/5194822.html
相关的时间验证
jQuery.validator.addMethod("nowtime", function (value, element) {
if (this.optional(element)) return true;
var assigntime = value;
var deadlinetime = new Date();
var reg = new RegExp('-', 'g');
assigntime = assigntime.replace(reg, '/');//正则替换
assigntime = new Date(parseInt(Date.parse(assigntime), 10));
deadlinetime = new Date(parseInt(Date.parse(deadlinetime), 10));
if (assigntime < deadlinetime) {
return false;
} else {
return true;
}
}, "不能小于当前时间！");
$.validator.addMethod("mintime", function (value, element, para) {
if (this.optional(element)) return true;
var assigntime = value;
var deadlinetime = para;
var reg = new RegExp('-', 'g');
assigntime = assigntime.replace(reg, '/');//正则替换
deadlinetime = deadlinetime.replace(reg, '/');
assigntime = new Date(parseInt(Date.parse(assigntime), 10));
deadlinetime = new Date(parseInt(Date.parse(deadlinetime), 10));
if (assigntime < deadlinetime) {
return false;
} else {
return true;
}
}, "结束时间必须大于开始时间");
$.validator.addMethod("maxtime", function (value, element, para) {
if (this.optional(element)) return true;
var assigntime = value;
var deadlinetime = para;
var reg = new RegExp('-', 'g');
assigntime = assigntime.replace(reg, '/');//正则替换
deadlinetime = deadlinetime.replace(reg, '/');
assigntime = new Date(parseInt(Date.parse(assigntime), 10));
deadlinetime = new Date(parseInt(Date.parse(deadlinetime), 10));
if (assigntime > deadlinetime) {
return false;
} else {
return true;
}
}, "开始时间必须小于结束时间");
