無法自定義bootstrap-datepicker

Question

我正在嘗試自定義日歷，但似乎沒有考慮到自定義，例如顯示“今天”按鈕或忽略過去的日期。 我嘗試了以下方法：

<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/bootstrap-datepicker3.min.css" rel="stylesheet">

在上身

<script src="js/jquery.js"></script>

<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap-datepicker.min.js"></script>

然后以以下形式：

    <script>
        $('.datepicker').datepicker({
            startDate: 0,
            todayBtn: "linked"
        });
    </script>
    <div class="form-group">
        <div class="input-group date" data-provide="datepicker">
            <input type="text" class="form-control" placeholder="Date *" id="caldate" required data-validation-required-message="Please choose date.">
            <span class="input-group-addon">
                <i class="glyphicon glyphicon-th"></i>
            </span>
            <p class="help-block text-danger"></p>
        </div>
    </div>

但是，我仍然沒有獲得“今天”按鈕。 我不確定原因是否是因為javascript代碼不正確？ （未正確調用日歷）或放錯位置了？

Answer 1

基本上，您的帶有todayBtn選項的jQuery調用並不是真正指向您的輸入。 您看到的datepicker功能基於您的html。 我將腳本移到了元素之后（因此它在目標元素位於DOM中之后運行），並更改了jQuery調用以查找正確的元素。 另外，我相信startDate選項應該是一個日期，因此我將其從0更改為'3/16/2016' 。 原始html不變...

<div class="form-group">
  <div class="input-group date" data-provide="datepicker">
    <input type="text" class="form-control"
      placeholder="Date *" id="caldate" required data-validation-required-message="Please choose date.">
    <span class="input-group-addon">
      <i class="glyphicon glyphicon-th"></i>
    </span>
    <p class="help-block text-danger"></p>
  </div>
</div>

<script>
  $("div.input-group.date").datepicker({
    startDate: '3/1/2016',
    todayBtn: "linked"
  });
</script>