Bootstrap 日期时间选择器无法正常工作

Question

我正在试验出色的 Bootstrap DateTimePicker 插件，但似乎一开始就命中了缓冲区。页面控件正确显示，但日历按钮完全没有响应 - 实际上没有弹出选择器。我创建了 this fiddle 来说明问题。检查 fiddle 的控制台输出并没有发现任何明显的错误。

我注意到示例代码使用的是 jQuery 1.8.3，所以我尝试回到那个版本，但无济于事。我怀疑我在这里弄错了，但我不太清楚那可能是什么。如果有任何帮助，我将不胜感激。

我使用的测试标记非常简单 - 直接从 Datetimepicker 示例文档中复制

<div class="form-group">
  <label for="dtp_singleshot" class="col-md-2 control-label">Choose</label>
  <div class="input-group date form_datetime col-md-5" data-link-
   field="dtp_singleshot">
  <input class="form-control" size="16" type="text" value="" readonly>
  <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
  <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
  </div>
<input type="hidden" id="dtp_singleshot" value="" /><br/>
</div>

Answer 1

首先，您必须从 input 中删除 readonly 属性。您不需要第二个隐藏输入。然后，您必须将 dtp_singleshot 中的 id 分配给您的 input-group 或 input。

<div class="form-group">
  <label for="dtp_singleshot" class="col-md-2 control-label" id="dtp_singleshot">Choose</label>
  <div class="input-group date form_datetime col-md-5" data-link-
   field="dtp_singleshot">
  <input class="form-control" size="16" type="text" value="">
  <span class="input-group-addon"><span class="glyphicon glyphicon-remove"></span></span>
  <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
  </div>
</div>

Bootstrap 日期时间选择器无法正常工作

Bootstrap Datetimepicker not functioning

twitter-bootstrap-3

bootstrap-datetimepicker

JSFIDDLE