日期选择器在模态 jquery 中不起作用

问题描述 投票:0回答:1
javascript html jquery datepicker
1个回答
0
投票

希望这能有所帮助

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">


<script>

    
    $(document).ready(function() {
    
    if ($('.datepicker').length) {
      $(".datepicker").datepicker({
        minDate: 0
      });
    }
    
    $('#exampleModal').modal('show');
    
});

</script>




<!-- Trigger button to open the modal -->
<button type="button" data-toggle="modal" data-target="#exampleModal">
  Open Modal
</button>

<!-- The Modal -->
<div class="modal" id="exampleModal">
  <div class="modal-dialog">
    <div class="modal-content">
      This is the modal content.
    
     <input class="datepicker" type="text" name="pickup_date" id="pickup_date" value="" placeholder="Select Date">
    </div>
  </div>
</div>






    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/themes/base/jquery-ui.min.css" integrity="sha512-ELV+xyi8IhEApPS/pSj66+Jiw+sOT1Mqkzlh8ExXihe4zfqbWkxPRi8wptXIO9g73FSlhmquFlUOuMSoXz5IRw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js" integrity="sha512-57oZ/vW8ANMjR/KQ6Be9v/+/h6bq9/l3f0Oc7vn6qMqyhvPd1cvKBRWWpzu0QoneImqr2SkmO4MSqU+RpHom3Q==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>

   
© www.soinside.com 2019 - 2024. All rights reserved.