使eternicode日期选择器在单击时打开，而不是聚焦

Question

eternicode twitter引导程序日期选择器在其所附的<input>字段获得焦点后立即弹出，您可以通过在官方演示页面上的日期选择器字段上进行制表来看到这一点。

相反，我希望它只在单击时打开。理想情况下，只要点击日历图标，日期选择器就会弹出。

如何防止它突然出现在焦点上？

Answer 1

在当前版本的库中，没有官方支持您想要做什么。文档列出了您可以实例化日期选择器的所有类型的标记，以及由此产生的行为。很明显，当在<input>元素上实例化日期选择器时，

聚焦输入（点击或选项卡）将显示选择器。

没有一个标记可以实例化日期选择器，它会琐碎地给你想要的东西。也没有任何配置选项可以让您选择哪些事件将触发日期选择器出现。

因此，要想做您想做的事情，需要对库进行一些反向工程。幸运的是，这很容易。

最简单的方法是像往常一样在<input>上实例化日期选择器，但随后我们自己去掉focus处理程序，用click处理程序替换它：

$('#my-input').datepicker()
              .off('focus')
              .click(function () {
                  $(this).datepicker('show');
              });

这非常适用于库的最新版本，如下所示http://jsfiddle.net/E4K56/1/

如果你想有额外的元素（比如日历按钮）来触发日期选择器的出现，你可以类似地将处理程序附加到它们上：

$('#some-button').click(function () {
    $('#my-input').datepicker('show');
});

Answer 2

我有与演示中相同的符号：

<label for="datepickerFrom" class="control-label input-group">Set the date from:</label>
<div class="form-group">
    <div class='input-group date' id='datepickerFrom'>
        <input type='text' class="form-control" />
        <span class="input-group-addon">
            <span class="glyphicon glyphicon-calendar"></span>
        </span>
    </div>
</div>

然后添加添加事件输入点击：

var options = {
    language: 'cs'
}
$('#datepickerFrom').datetimepicker(options);
$('#datepickerFrom input').off('focus')
    .click(function () {
        $(this).parent().data("DateTimePicker").show();
    })