在初始化时将数据属性添加到 jquery ui datepicker答案

【问题标题】：add data attribute to jquery ui datepicker on initialization在初始化时将数据属性添加到 jquery ui datepicker
【发布时间】：2016-03-07 15:40:13
【问题描述】：

我正在初始化 jquery ui 的 datepicker，如下所示：

var datesArray=['3/7/2016','3/12/2016']
$('#datepicker').datepicker({
    inline: true,
    beforeShowDay: function (date) {
        var theday = (date.getMonth()+1) +'/'+ 
            date.getDate()+ '/' + 
            date.getFullYear();
        return [true,$.inArray(theday, datesArray) >=0 ? "specialDate":''];
    }
});

这将创建日历，其中 specialDate 类应用于 datesArray 中的所有日期。

此外，我需要在日期选择器初始化时为这些相同的日期添加一个唯一的数据属性值（类似于data-value="39"），但我不确定如何选择日期。

我可以使用类似的东西

var datavalues = {
    "3/7/2016" : "38",
    "3/12/2016" : "39"
};

其中38 和39 是data-values。

这个关于adding a custom parameter 的问题让我很接近，但我不确定如何使用它来在创建时添加数据属性。

【问题讨论】：

没有开箱即用的方法可以做到这一点。最短的方法是使用onChangeMonthYear，但它仍然非常麻烦和/或脆弱。你想达到什么目的？我相当肯定有比不断绑定和取消绑定数据更好的方法
@blgt 请记住，不过，我基本上是在尝试使用数据层填充日历。我确信我可以在创建日历后立即做一些愚蠢的事情，但我更愿意在创建日历时添加数据属性，有点像应用该类的方式。
这是对问题的重新陈述。您能否通过附加数据提供更多关于您试图实现的目标的详细信息？（此外，相关信息可以编辑到问题中而不是评论中，以获得更好的格式）
当一个日期被选中时，我想用 js 使用与该日期相关联的数据。
@adamrowe 您可以将完整的 [date-data] 数组与相关输入绑定，并在需要时使用 onSelect 选择您需要的数组。或者根本不用绑定它，只需将其保留为内存变量

标签： jquery jquery-ui jquery-ui-datepicker custom-data-attribute

【解决方案1】：

在创建日期选择器时，您将无法使用 .data() 或作为数据属性执行此操作。你可以像这样使用onSelect：

工作示例：https://jsfiddle.net/ha5zgvby/

HTML

<p>Date:
  <input type="text" id="datepicker" />
</p>
<p>Stuff:
  <input type="text" id="special" />
</p>

JQuery

var datavalues = {
  "03/07/2016": "38",
  "03/12/2016": "39"
};
$(function() {
  var $result = $("#special");
  $('#datepicker').datepicker({
    inline: true,
    onSelect: function(dt, obj) {
      $result.val(datavalues[dt]);
    },
    altField: "#result"
  });
});

当一个日期被选中时，函数被传递给选中的值。如果该值作为索引在您的对象中，那么您可以以某种方式使用它。

【讨论】：

@Twisty.. 如何在 datepicker 的日期中显示任意数字的计数？
@PathikVejani 不确定我是否理解这个问题。您的意思是显示两个日期范围之间的天数吗？
@Twisty 看到这个我的 qtn：stackoverflow.com/questions/36625021/…