Question

正在处理一个表单，该表单正在使用引导日期选择器向用户显示日期。我有一个“出生日期”字段，据此试图禁用自当前日期起18岁以下的任何用户的年龄。例如，由于我们在2019年，日期选择器只能显示2001年以下的年份，例如2001年，2000年，1999年，1998年，1997年等

这可以正常工作（年），但是我无法使用月份和特定日期，例如，由于我们在01/02/2019中，因此datepicker应该禁用2001年2月1日之后的任何日期。

出生日期

//dob
<div class="form-line registar love">
      <input type="text" placeholder="Date of Birth *" class="form-input" name="dob" id="dob" value="#" title="You should be over 18 years old" required>

      <label class="error error-tip" for="dob" id="dobErr" style="display: none; color:red; font-size: 11px;">You should be over 18 years old</label>
 </div>
//end dob

JavaScript逻辑

var maxBirthdayDate = new Date();
maxBirthdayDate.setFullYear( maxBirthdayDate.getFullYear() - 18 );
maxBirthdayDate.setMonth(11,31);
$( function() {
  $( "#dob" ).datepicker({
    changeMonth: true,
    changeYear: true,
    dateFormat: 'yy-mm-dd',
    maxDate: maxBirthdayDate,
    yearRange: '1900:'+maxBirthdayDate.getFullYear(),
  });
});

Answer 1

对于bootstrap-datepicker（^ 1.9.0），我已经使用它解决了。

$('#dob').datepicker({ endDate: '-18Y' });

Answer 2

您可以通过非常简单的方式使用minDate和maxDate进行验证，以防止用户在18年之前选择DOB。

$("#dob").datepicker( { minDate: '-30Y',dateFormat: 'dd/mm/yy', maxDate: '-18Y' });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>


<p>Date: <input type="text" id="dob" /></p>

Answer 3

带有JS日期和引导日期选择器：

var today = new Date();
var dd = today.getDate();
var mm = today.getMonth() + 1; //January is 0!

var yyyy = today.getFullYear() -18;
if (dd < 10) {
    dd = '0' + dd;
} 
if (mm < 10) {
    mm = '0' + mm;
} 
var yearsago = mm + '/' + dd + '/' + yyyy;

或使用Moment.js

var yearsago = moment(new Date()).subtract(18, 'years').format("DD-MM-YYYY");

$('#dob').datepicker('setStartDate', yearsago);

或

$('#dob').datepicker({ 
   startDate: yearsago
});

引导日期选择器中的禁用年低于18年的问题

3 个答案: