javascript - JQuery 日期选择器无法禁用以前的日期

Question

我在我的 PHP 站点中使用 jQuery 日期选择器。它工作正常，但我想从中禁用以前的日期。我尝试了所有设置，但无法禁用它。

<center><div class="card shadow mb-4 col-xs-12 col-md-8 border-bottom-primary">
  <div class="card-header py-3">
    <h4 class="m-2 font-weight-bold text-primary">Add Employee</h4>
  </div>
  <a href="employee.php?action=add" type="button" class="btn btn-primary bg-gradient-primary">Back</a>
  <div class="card-body">
    <div class="table-responsive">
      <form role="form" method="post" action="emp_transac.php?action=add">

        <div class="form-group">
          <input class="form-control" placeholder="First Name" name="firstname" required>
        </div>
        <div class="form-group">
          <input class="form-control" placeholder="Last Name" name="lastname" required>
        </div>
        <div class="form-group">
          <input class="form-control" type="email" id="email" placeholder="Email" name="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,}$" required>
        </div>
        <div class="form-group">
          <input class="form-control" placeholder="Phone Number" name="phonenumber" required>
        </div>
        <div class="form-group">
          <?php
                                echo $opt;
                              ?>
        </div>
        <div class="form-group">
          <input type="date" id="FromDate" name="hireddate" value="yyyy-MM-dd" class="form-control" />
        </div>
        <div class="form-group">
          <select class="form-control" id="province" placeholder="Province" name="province" required></select>
        </div>
        <div class="form-group">
          <select class="form-control" id="city" placeholder="City" name="city" required></select>
        </div>
        <hr>
        <button type="submit" class="btn btn-success btn-block"><i class="fa fa-check fa-fw"></i>Save</button>
        <button type="reset" class="btn btn-danger btn-block"><i class="fa fa-times fa-fw"></i>Reset</button>

      </form>  
    </div>
  </div>
</div></center>

jQuery( document ).ready( function ( e ) {
  if ( jQuery( '.your-date-picker-selector' ).length ) {
    jQuery.datepicker.setDefaults({
      minDate: 0,
      maxDate: "+12m"
    });
  }
});

标签： javascriptphpjqueryjquery-ui-datepicker

Answer 1

我是个白痴。我忘了包括 jQuery(UI) js 和 css。它现在应该与 .datepicker.min/minDate 一起工作。这是我认为您正在寻找的工作片段。：/

$("#datepicker").datepicker({ minDate: 0, maxDate: '+12m'});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" rel="stylesheet"/>
<input type="text" id="datepicker">