bootstrap-datepicker 中 beforeShowDay 的标题不起作用

Question

我想在datepicker 的每一天下方插入一些文本（在这种情况下为titleAttr），我试图通过beforeShowDay 实现这一点。根据doc，关于beforeShowDay的函数的返回值如下，

具有以下属性的对象：

启用：与上面的布尔值相同

classes：与上面的 String 值相同

工具提示：通过 HTML 标题属性应用到该日期的工具提示

因此，如果我将tooltip 设置为titleAttr，我将在日期选择器中获得多个a 标签，属性title 设置为titleAttr，因此我可以在a 标签之后插入一些文本，但是我没有得到任何带有title 属性的标签，我错了吗？

$datepicker = $('.input-group.date');
$datepicker.datepicker({
  beforeShowDay: function(date) {
    return [true, "", "titleAttr"];
  }
});

.datepicker td a[title]:after {
  content: attr(title);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/css/bootstrap-datepicker3.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.js"></script>

<div class="input-group date pull-right" style="width: 150px;">
  <input type="text" class="form-control" />
  <div class="input-group-addon">
    <span class="glyphicon glyphicon-calendar"></span>
  </div>
</div>

Answer 1

正如您在问题中所说，beforeShowDay 可以返回 具有以下属性的对象：... 而在您的情况下，您的 beforeShowDay 返回 Array。

如果您将返回值更改为具有上述属性的Object，您将获得以下代码：

$datepicker = $('.input-group.date');
$datepicker.datepicker({
  beforeShowDay: function(date) {
    return {
      enabled: true,
      classes: "", 
      tooltip: "titleAttr"
    };
  }
});

.datepicker td a[title]:after {
  content: attr(title);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/css/bootstrap-datepicker3.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.js"></script>

<div class="input-group date pull-right" style="width: 150px;">
  <input type="text" class="form-control" />
  <div class="input-group-addon">
    <span class="glyphicon glyphicon-calendar"></span>
  </div>
</div>

注意一天的picker生成的HTML如下，所以没有a标签：

<td class="day" title="titleAttr">1</td>