Question

我正在尝试使用this example在网页上实现datetimepicker。

我正在使用Bootstrap 3。

此示例使用Twitter bootstrap 2，因此我必须更改Bootstrap 2 - 3迁移指南之后的一些类。

我的问题是，当我点击它成功显示的日历图标时，应该嵌入日历底部的时间图标不会显示。

有谁知道为什么会这样？

  <div id="datetimepicker2" class="input-append">
      <input data-format="MM/dd/yyyy HH:mm:ss PP" type="text"/>
    <span class="input-group-addon">
      <i class="glyphicon glyphicon-calendar glyphicon-time">
      </i>
    </span>
  </div>
</div>

Answer 1

不确定这是否是问题，但请确保您的bootstrap css资产中包含您的glyphicons的正确网址

Answer 2

在Bootstrap 3中执行此操作的新方法是使用类'input-group'而不是'input-append'。您还必须将类“form-control”放在输入中。

<div id="datetimepicker2" class="input-group">
    <input class="form-control" data-format="MM/dd/yyyy HH:mm:ss PP" type="text" />
    <span class="input-group-addon">
      <i class="glyphicon glyphicon-calendar glyphicon-time"></i>
    </span>
</div>

您可以在此处查看此示例：http://jsfiddle.net/Ezrv9/3/ 您还可以在此处获得更多信息：http://getbootstrap.com/components/#input-groups

Answer 3

<span class="input-group-addon">
  <span class="glyphicon glyphicon-calendar"></span>
</span>

Twitter引导程序图标未显示在日历上

3 个答案: