使用jQuery验证结束日期是否大于开始日期
https://stackoverflow.com/questions/833997
-
08-07-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian题
如何在jQuery中检查/验证结束日期[文本框]是否大于开始日期[文本框]？
解决方案
只是扩大融合答案。这个扩展方法使用jQuery validate插件。它将验证日期和数字
jQuery.validator.addMethod("greaterThan",
function(value, element, params) {
if (!/Invalid|NaN/.test(new Date(value))) {
return new Date(value) > new Date($(params).val());
}
return isNaN(value) && isNaN($(params).val())
|| (Number(value) > Number($(params).val()));
},'Must be greater than {0}.');
使用它：
$("#EndDate").rules('add', { greaterThan: "#StartDate" });
或
$("form").validate({
rules: {
EndDate: { greaterThan: "#StartDate" }
}
});
其他提示
var startDate = new Date($('#startDate').val());
var endDate = new Date($('#endDate').val());
if (startDate < endDate){
// Do something
}
我认为应该这样做
晚会很晚但这是我的一部分
Date.parse(fromDate) > Date.parse(toDate)
以下是详细信息：
var from = $("#from").val();
var to = $("#to").val();
if(Date.parse(from) > Date.parse(to)){
alert("Invalid Date Range");
}
else{
alert("Valid date Range");
}
引用jquery.validate.js和jquery-1.2.6.js。 将startDate类添加到开始日期文本框中。 将endDate类添加到结束日期文本框中。
将此脚本块添加到您的页面： -
<script type="text/javascript">
$(document).ready(function() {
$.validator.addMethod("endDate", function(value, element) {
var startDate = $('.startDate').val();
return Date.parse(startDate) <= Date.parse(value) || value == "";
}, "* End date must be after start date");
$('#formId').validate();
});
</script>
希望这会有所帮助： - ）
我只是在修补 danteuno的回答，发现虽然善意，但遗憾的是它在几个浏览器上被打破了不是 IE。这是因为IE对它接受的作为Date构造函数的参数的内容非常严格，但其他人不会。例如，Chrome 18提供
> new Date("66")
Sat Jan 01 1966 00:00:00 GMT+0200 (GTB Standard Time)
这会导致代码采用<！>“比较日期<！>”;路径，它从那里开始走下坡路（例如new Date("11")大于new Date("66")，这显然与预期效果相反）。
因此在考虑之后我修改了代码以优先考虑<！> quot; numbers <！> quot; <！>日期<！>的路径使用在JavaScript中验证十进制数字 - 提供的优秀方法验证输入确实是数字的 - IsNumeric （）。
最后，代码变为：
$.validator.addMethod(
"greaterThan",
function(value, element, params) {
var target = $(params).val();
var isValueNumeric = !isNaN(parseFloat(value)) && isFinite(value);
var isTargetNumeric = !isNaN(parseFloat(target)) && isFinite(target);
if (isValueNumeric && isTargetNumeric) {
return Number(value) > Number(target);
}
if (!/Invalid|NaN/.test(new Date(value))) {
return new Date(value) > new Date(target);
}
return false;
},
'Must be greater than {0}.');
来自文本字段的日期值可以通过jquery的.val（）方法获取，如
var datestr1 = $('#datefield1-id').val();
var datestr2 = $('#datefield2-id').val();
我强烈建议在比较之前解析日期字符串。 Javascript的Date对象有一个parse（） - Method，但它只支持US日期格式（YYYY / MM / DD）。它返回自unix纪元开始以来的毫秒数，因此您只需将您的值与<！> gt;进行比较即可。或<！> lt;。
如果您需要不同的格式（例如ISO 8661），则需要使用正则表达式或免费的date.js库。
如果你想成为超级用户友好的，你可以使用jquery ui datepickers而不是textfields。有一个允许输入日期范围的日期选择器变体：
http://www.filamentgroup.com/lab/date_range_picker_using_jquery_ui_16_and_jquery_ui_css_framework/
所以我需要这个规则是可选的，上述建议都不是可选的。如果我调用该方法，即使我将其设置为需要值，它也会按要求显示。
这是我的电话：
$("#my_form").validate({
rules: {
"end_date": {
required: function(element) {return ($("#end_date").val()!="");},
greaterStart: "#start_date"
}
}
});//validate()
我的addMethod不如Mike E.评价最高的答案那么强大，但我正在使用JqueryUI日期选择器来强制选择日期。如果有人可以告诉我如何确保日期是数字并且方法是可选的，那将是很好的，但是现在这个方法适用于我：
jQuery.validator.addMethod("greaterStart", function (value, element, params) {
return this.optional(element) || new Date(value) >= new Date($(params).val());
},'Must be greater than start date.');
我喜欢Franz所说的，因为我正在使用它：P
var date_ini = new Date($('#id_date_ini').val()).getTime();
var date_end = new Date($('#id_date_end').val()).getTime();
if (isNaN(date_ini)) {
// error date_ini;
}
if (isNaN(date_end)) {
// error date_end;
}
if (date_ini > date_end) {
// do something;
}
$(document).ready(function(){
$("#txtFromDate").datepicker({
minDate: 0,
maxDate: "+60D",
numberOfMonths: 2,
onSelect: function(selected) {
$("#txtToDate").datepicker("option","minDate", selected)
}
});
$("#txtToDate").datepicker({
minDate: 0,
maxDate:"+60D",
numberOfMonths: 2,
onSelect: function(selected) {
$("#txtFromDate").datepicker("option","maxDate", selected)
}
});
});
或访问此链接
jQuery('#from_date').on('change', function(){
var date = $(this).val();
jQuery('#to_date').datetimepicker({minDate: date});
});
在javascript / jquery中，大多数开发人员使用From <！> amp;迄今为止比较哪个是字符串，而不转换为日期格式。 从日期开始比较的最简单方法是到目前为止。
Date.parse(fromDate) > Date.parse(toDate)
始终在比较之前解析并获得准确结果
function endDate(){
$.validator.addMethod("endDate", function(value, element) {
var params = '.startDate';
if($(element).parent().parent().find(params).val()!=''){
if (!/Invalid|NaN/.test(new Date(value))) {
return new Date(value) > new Date($(element).parent().parent().find(params).val());
}
return isNaN(value) && isNaN($(element).parent().parent().find(params).val()) || (parseFloat(value) > parseFloat($(element).parent().parent().find(params).val())) || value == "";
}else{
return true;
}
},jQuery.format('must be greater than start date'));
}
function startDate(){
$.validator.addMethod("startDate", function(value, element) {
var params = '.endDate';
if($(element).parent().parent().parent().find(params).val()!=''){
if (!/Invalid|NaN/.test(new Date(value))) {
return new Date(value) < new Date($(element).parent().parent().parent().find(params).val());
}
return isNaN(value) && isNaN($(element).parent().parent().find(params).val()) || (parseFloat(value) < parseFloat($(element).parent().parent().find(params).val())) || value == "";
}
else{
return true;
}
}, jQuery.format('must be less than end date'));
}
希望这会有所帮助：）
首先使用分割功能分割两个输入框的值。 然后以相反的顺序连续相同。 在concat nation解析为整数之后。 然后比较if语句中的两个值。 eg.1 <！> gt; 20-11-2018 2 <！> gt; 21-11-2018
分割后的分割和连续新值20181120和20181121之后的比较相同。var date1 = $('#datevalue1').val();
var date2 = $('#datevalue2').val();
var d1 = date1.split("-");
var d2 = date2.split("-");
d1 = d1[2].concat(d1[1], d1[0]);
d2 = d2[2].concat(d2[1], d2[0]);
if (parseInt(d1) > parseInt(d2)) {
$('#fromdatepicker').val('');
} else {
}
这应该有效
$.validator.addMethod("endDate", function(value, element) {
var startDate = $('#date_open').val();
return Date.parse(startDate) <= Date.parse(value) || value == "";
}, "* End date must be after start date");
如果格式保证正确YYYY / MM / DD并且两个字段之间完全相同，那么您可以使用：
if (startdate > enddate) {
alert('error'
}
作为字符串比较
