JQuery验证日期范围之间的日期

我有一个输入字段，用户可以在日期范围之间插入日期。JQuery验证日期范围之间的日期

所以我加入jQuery的验证对象的新方法：

$.validator.addMethod("dateRange", function(value, element, from, to){ 
    try { 
     var date = new Date(value); 
     if(date >= from && date <= to) 
      return true; 
    } catch(e) { 
    } 
    return false; 
}

然后我添加了一个新的班规：

$.validator.addClassRules({ 
    myDateFieldRangeValidate: { 
     dateRange: {fromDate, toDate} 
    } 
});

最后我加入了类输入：

$("#myField").addClass("myDateFieldRangeValidate");

那么，如何能通过两个日期，以验证功能？

更新：增加了一个代码片段

$.validator.addMethod("dateRange", function(value, element, from, to){ 
 
    try { 
 
     var date = new Date(value); 
 
     if(date >= from && date <= to) 
 
      return true; 
 
    } catch(e) { 
 
    } 
 
    return false; 
 
}); 
 

 
var fromDate = new Date("2017-02-01"); 
 
var toDate = new Date("2017-12-31"); 
 

 
$.validator.addClassRules({ 
 
    myDateFieldRangeValidate: { 
 
     dateRange: {fromDate, toDate} 
 
    } 
 
}); 
 

 
$("#myField").addClass("myDateFieldRangeValidate"); 
 

 
$("#btnValidate").click(function(){ 
 
    $("#frm1").validate(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/additional-methods.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.min.js"></script> 
 
<form id="frm1"> 
 
    Date <input type="text" id="myField"> 
 
    <input type="button" id="btnValidate" value="Validate"> 
 
</form>

来源

2017-04-07 Alessandro

看到http://stackoverflow.com/questions/833997/validate-that-end-date-is -greater超开始日期与 - jQuery的 – user3441151

您可以将元素添加为数据属性，起始日期和结束日期，并把他们从元件 – geo

对不起，我听不懂...... – Alessandro

感谢阿伦P约翰尼拉，我张贴在这里他的小提琴：

$.validator.addMethod("dateRange", function(value, element, params) { 
 
    try { 
 
    var date = new Date(value); 
 
    if (date >= params.from && date <= params.to) { 
 
     return true; 
 
    } 
 
    } catch (e) {} 
 
    return false; 
 
}, 'message'); 
 

 
var fromDate = new Date("2017-02-01"); 
 
var toDate = new Date("2017-12-31"); 
 

 
$.validator.addClassRules({ 
 
    myDateFieldRangeValidate: { 
 
    dateRange: { 
 
     from: fromDate, 
 
     to: toDate 
 
    } 
 
    } 
 
}); 
 

 
$("#myField").addClass("myDateFieldRangeValidate"); 
 
$("#frm1").validate(); 
 
$("#btnValidate").click(function() { 
 
    console.log($("#frm1").valid()) 
 
}); 
 

 
jQuery(function($) { 
 
    var validator = $('#myform').validate({ 
 
    rules: {}, 
 
    messages: {} 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/additional-methods.min.js"></script> 
 
<form id="frm1"> 
 
    Date 
 
    <input type="text" id="myField" value="16 Feb 2017"> 
 
    <input type="button" id="btnValidate" value="Validate"> 
 
</form>

来源

2017-04-07 14:15:05 Alessandro

这里是一个办法让jQuery的验证与功能给开始日期和结束日期

<script src="//ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/additional-methods.js"></script> 
<script> 
$(document).ready(function() { 
// add a method. calls one built-in method, too. 
jQuery.validator.addMethod("optdate", function(value, element) { 
    var startDate= new Date(jQuery(element)[0].attributes['data-rule-startDate'].value); 
    var endDate= new Date(jQuery(element)[0].attributes['data-rule-endDate'].value); 
    var d = new Date(value); 
    console.log(d) 
    return (d.getTime() <= endDate.getTime() && d.getTime() >= startDate.getTime()) 
}, "Please enter a valid date." 
); 



$('#frm1').validate(); 



}); 
</script> 
<html> 
<form id="frm1"> 
    Date <input type="text" id="myField" name="myField" data-rule-optdate="true" data-rule-startDate="2017-12-12" data-rule-endDate="2018-12-12"> 
</form> 
</html>

来源

2017-04-07 14:25:26 geo

JQuery验证日期范围之间的日期

回答

相关问题