日期选择器缺少引导导航箭头

Pol*_*Set 1 html javascript css datepicker twitter-bootstrap

我意识到存在与此类似的问题,其中问题是未引用正确的字体系列。但是,在我使用的版本中,他们不使用图标作为导航箭头,而是使用html字符代码作为双左箭头和双右箭头。

我的html参考-

<link href="Content/css/bootstrap.css" rel="stylesheet" />
<link href="Content/css/datepicker.css" rel="stylesheet" />
<link href="Content/css/navbar.css" rel="stylesheet" />
<link href="Content/css/jquery-ui.min.css" rel="stylesheet" />
<link href="Content/css/jquery-ui.structure.min.css" rel="stylesheet" />
<link href="Content/css/jquery-ui.theme.min.css" rel="stylesheet" />

<script type= "text/javascript" src="Scripts/jquery-2.2.0.min.js"></script>
<script type= "text/javascript" src="Scripts/bootstrap.min.js"></script>
<script type= "text/javascript" src="Scripts/bootstrap-datepicker.js"></script>
<script type= "text/javascript" src="Scripts/moment.min.js"></script>
<script type= "text/javascript" src="Scripts/jquery-ui.min.js"></script>


<script type="text/javascript">
    $(document).ready(function () {
        $(".datepicker").datepicker({
            format: 'dd/mm/yyyy',
            autoclose: true,
            todayBtn: 'linked',
            useCurrent: true,
            ignoreReadonly: true
        })
    });
</script>
Run Code Online (Sandbox Code Playgroud)

这是bootstrap-datepicker.js文件中的相关代码-

    headTemplate: '<thead>'+
                      '<tr>'+
                        '<th colspan="7" class="datepicker-title"></th>'+
                      '</tr>'+
                        '<tr>'+
                            '<th class="prev">&laquo;</th>'+
                            '<th colspan="5" class="datepicker-switch"></th>'+
                            '<th class="next">&raquo;</th>'+
                        '</tr>'+
                    '</thead>',
    contTemplate: '<tbody><tr><td colspan="7"></td></tr></tbody>',
    footTemplate: '<tfoot>'+
                        '<tr>'+
                            '<th colspan="7" class="today"></th>'+
                        '</tr>'+
                        '<tr>'+
                            '<th colspan="7" class="clear"></th>'+
                        '</tr>'+
                    '</tfoot>'
};
Run Code Online (Sandbox Code Playgroud)

我所得到的是与一般标题背景相同的灰色,然后是与日历上任何特定日期一样的普通蓝色“悬停”。

顽皮的日期选择器

我在其他.css文件中查找了冲突的“ .prev”定义,但未发现任何特定于表,日期选择器或标头的内容。我也尝试过使用glyphicons替换编码,结果相同。

我的小提琴-

JFiddle编码样本

Fer*_*eón 5

我已经解决了:

<script>
$(document).ready( function(){

  $('#datepicker').datepicker({
    minDate: "01/01/1965",
    maxDate: "12/31/2005",
    startDate: "01/01/1965",
    endDate:    "12/31/2005",
    changeYear: true,
    changeMonth: true,
    autoclose: true
  });

  $('.prev i').removeClass();
  $('.prev i').addClass("fa fa-chevron-left");

  $('.next i').removeClass();
  $('.next i').addClass("fa fa-chevron-right");

});
Run Code Online (Sandbox Code Playgroud)

删除标签上的类,然后分配一个真棒字体的箭头类