无法自定义 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>

但是，我仍然没有得到 'Today' 按钮。不知道是不是因为javascript代码不对？（没有正确调用日历）或放错地方？

Answer 1

基本上，您使用 todayBtn 选项的 jQuery 调用并没有真正指向您的输入。您看到的日期选择器功能基于您的 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>

无法自定义 bootstrap-datepicker

Not able to customize bootstrap-datepicker

javascript

html

bootstrap-datepicker