Question

我正在使用Boostrap DateTimePicker。触发dp.change事件后，我无法将新日期设置为date变量的值。可能是什么问题？

var date = null;
$('#datetimepicker6').datetimepicker({
    format: 'MM/DD/YYYY HH:mm',
}).on("dp.change", function(e) {
   date = e.date;           
   $('#datetimepicker7').data("DateTimePicker").minDate(e.date);
});
console.log(date);

Answer 1

使用Bootstrap Datepicker。。这很好。.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title></title>
    <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/css/bootstrap-datepicker.min.css">
</head>
<body>
    <div class="intl-dep-date">
        <label for="intl_dep_date">Departure</label>
        <input class="calendar" readonly type="text" autocomplete="off" name="int_dep" id="intl_dep_date" required placeholder="Departure" />
    </div>
    <div class="col-lg-2 col-md-12 intl-ret-date">
        <label for="intl_dep_date">Return</label>
        <input class="calendar disabled" readonly type="text" autocomplete="off" name="int_ret" id="intl_ret_date" disabled readonly placeholder="Return"/>
    </div>

<script
  src="https://code.jquery.com/jquery-3.4.1.min.js"
  integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
  crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.9.0/js/bootstrap-datepicker.min.js" type="text/javascript" charset="utf-8" async defer></script>
<script>
 $("#intl_dep_date").datepicker({
        todayBtn: 1,
        autoclose: true,
        startDate: "today",
        todayHighlight: true,
    }).on('changeDate', function (selected) {
        var minDate = new Date(selected.date.valueOf());
        $('#intl_ret_date').datepicker('setStartDate', minDate);
        }

    $("#intl_ret_date").datepicker({
        startDate: "today",
        autoclose: true,
        todayHighlight: true
    }).on('changeDate', function (selected) {
            var minDate = new Date(selected.date.valueOf());
            $('#intl_dep_date').datepicker('setEndDate', minDate);
        });


</script>
</body>
</html>

如何在“ dp.change”事件之后使用选定的日期？

1 个答案: