如何設置bootstrap-datepicker

Question

我正在嘗試使用bootstrap-datepicker 。 問題是我只獲得了沒有樣式的輸入。 這是我的包括：

<link href="../css/bootstrap.css" rel="stylesheet" media="screen">
<link href="../css/datepicker.css" rel="stylesheet">
<link href="../css/main.css" rel="stylesheet">

<script src="../js/jquery.js"></script>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
        <script src="../js/assets/html5shiv.js"></script>
        <script src="../js/assets/respond.min.js"></script>
<![endif]-->
<script src="../js/bootstrap.min.js"></script>
<script src="../js/assets/bootstrap-datepicker.js"></script>
<script src="../js/main.js"></script>

這是html：

<div class="input-append date" data-date="12-02-2012" data-date-format="dd-mm-yyyy">
    <input id="dp3" size="16" type="text" value="12-02-2012"/>
    <span class="add-on"><i class="icon-calendar" id="cal2"></i></span>
</div>

這是javascript：

$('#dp3').datepicker();

怎么了？？

注意：當我關注輸入時沒有出現日歷，但沒有圖標。

Answer 1

如果您使用此版本而不是必須將它與Bootstrap 2一起使用，因為它不完全支持Bootstrap 3.如果您使用Bootstrap 3，您必須自己處理圖標問題 ，通過添加不同的圖標，使用按鈕代替或完全刪除該部分。

Answer 2

從您的代碼中，似乎您缺少添加以下css文件。

1. bootstrap css
2. bootstrap datepicker css

確保你添加它。

在這里看到工作的JSFiddle

Answer 3

要解決此問題，請在加載DOM時進行此調用：

$(function() {
  $('#dp3').datepicker();
});

要么

 $(document).ready(function(){
         $('#dp3').datepicker();
       });