获取引导日期选择器的 onclose 事件答案

【问题标题】：Getting the onclose event for a bootstrap datepicker获取引导日期选择器的 onclose 事件
【发布时间】：2017-09-19 19:23:42
【问题描述】：

我有一个日期选择器，我试图弄清楚当用户在框外单击时（日历关闭时）如何提醒测试消息。

这是我的 html 和一些 Laravel

<input data-id="{{ $scan->id }}" id="{{ $scan->id }}"   placeholder="mm/dd/yyyy" type="bs-date" class="form-control datepicker-test" value="">

这是我的 jquery，我不包括脚本标签或 document.ready

$('.datepicker-test').datepicker({
            onClose: function () {
                alert('wow');
            }
        });

【问题讨论】：

标签： jquery twitter-bootstrap datepicker

【解决方案1】：

如果您使用的是boostrap datepicker，则需要更改为：

$('.datepicker').datepicker({
    onClose: function () {
        alert('wow');
    }
});

到：

$('.datepicker').datepicker().on('hide', function(e) {
    console.log('wow');
});

hide event: 当日期选择器被隐藏时触发。

$('.datepicker').datepicker().on('hide', function(e) {
  console.log('wow');
});

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/css/bootstrap-datepicker.css"/>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/js/bootstrap-datepicker.min.js"></script>


<div class="container">
    <div class="row">
        <div class="input-group date">
            <input data-id="id1" id="id1"   placeholder="mm/dd/yyyy" type="bs-date" class="form-control datepicker" value="">
            <div class="input-group-addon">
                <span class="glyphicon glyphicon-th"></span>
            </div>
        </div>

    </div>
</div>

【讨论】：