关闭日历（datetimepicker），当输入文本框被隐藏并且只有按钮 / input-group-addon答案

【问题标题】：Close calendar (datetimepicker), when input text box is hidden and only have the button / input-group-addon关闭日历（datetimepicker），当输入文本框被隐藏并且只有按钮 / input-group-addon
【发布时间】：2017-11-20 23:00:17
【问题描述】：

我正在使用 Bootstrap Datetimepicker 在我的页面上有一个日历并选择日期和时间。

这要求我有一个输入组。我已经设置好了，就像这样：

<div id="dateChoose" class="form-group">
    <div class='input-group date' id='datetimepicker1'>
        <input type='hidden' style="border:none" class="form-control" />
        <span class="btn btn-primary input-group-addon ">
            <span class="glyphicon glyphicon-calendar">
            </span>
        </span>
    </div>
</div>

一旦我不想要文本框（只是一个用于获取日期的按钮）并且无法正确地将 datetimepicker 的功能添加到单个按钮，我决定“屏蔽” input-group-addon 作为带有一些 CSS 的按钮，看起来像另一个按钮，并隐藏文本框 (type='hidden')。

This (image) 看起来不错，我认为。但是现在，当我隐藏<input> 时，当我点击屏幕上的某个位置时，日历在打开后并没有关闭。

我该如何解决这个问题，关闭日历，当我点击某个地方时，如果没有隐藏文本，它会是这样吗？

【问题讨论】：

标签： javascript jquery html twitter-bootstrap eonasdan-datetimepicker

【解决方案1】：

给你的输入日历一个 id，然后在下面添加代码

$("#id").on("blur", function(e) { $(this).off("focus").datepicker("hide"); });

当你失去焦点时，你的日历应该会消失

【讨论】：