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>

然而，我仍然没有得到今天的＆＃39;按钮。我不确定原因是因为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

1 个答案: