Bootstrap DateRangePicker 日历和右/左图标不出现答案

【问题标题】：Bootstrap DateRangePicker Calendar and Right/Left Icon not AppearingBootstrap DateRangePicker 日历和右/左图标不出现
【发布时间】：2016-11-26 05:27:12
【问题描述】：

我正在使用 Bootstrap 日期范围选择器，在此我无法获取日历和左/右箭头字形图标。

下面是我实现的代码。

<!-- Include Required Prerequisites -->
<script type="text/javascript" src="//cdn.jsdelivr.net/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/bootstrap/latest/css/bootstrap.css" />

<!-- Include Date Range Picker -->
<script type="text/javascript" src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />

页面上日期范围选择器的代码：

<label style="padding-right:5px;">Select range: </label>    
  <h:inputText id="dateRangeFilterArchive" class="dateRangeArchive" style="width:200px;height:35px;vertical-align:center;text-align:center"/>
    <script type="text/javascript">
        $(document).ready(function() {
          $(function() {
            $('.dateRangeArchive').daterangepicker();
            });
        });
  </script>

但是，日历和左/右箭头的字形图标没有出现。

任何帮助表示赞赏，

谢谢， Mufaddal。

【问题讨论】：

Try this link: 或许这会解决你的问题。
谢谢，但没有帮助:)

标签： css twitter-bootstrap twitter-bootstrap-3 calendar bootstrap-daterangepicker

【解决方案1】：

编辑您的daterangepicker.js

找到此代码

html += '<th class="prev available"><i class="fa fa-arrow-left icon icon-arrow-left glyphicon glyphicon-arrow-left"></i></th>'

还有这个

html += '<th class="next available"><i class="fa fa-arrow-right icon icon-arrow-right glyphicon glyphicon-arrow-right"></i></th>'

像这样编辑

html += '<th class="prev available"><i class="glyphicon glyphicon-arrow-left"></i></th>'
.....
html += '<th class="next available"><i class="glyphicon glyphicon-arrow-right"></i></th>'

这对我有用

【讨论】：

【解决方案2】：

可能您没有在代码中添加daterangepicker.js 和daterangepicker.css

<script type="text/javascript" src="//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.css" />

【讨论】：

谢谢，但没有帮助。 :)