jquery datepicker - 覆盖数据属性中的选项答案

【问题标题】：jquery datepicker - override options from data-attributejquery datepicker - 覆盖数据属性中的选项
【发布时间】：2023-04-06 09:53:02
【问题描述】：

我正在使用这个标记

<label> Date <input type="text" data-datepicker="{maxDate: '+1d'}" /></label>
<label> Another date <input type="text" data-datepicker="" /></label>
<script>
$('[data-datepicker]').each(function() {
      // init the options var with some default values (dateFormat etc)
      // that can be overridden by the data-datepicker values
      // also, new values can be added to the options from data-datepicker
      // such as in the above example "maxDate"
      var options = TODO;      

      $(this).datepicker(options);
});
</script>

我真的不知道从那个选项对象开始.. 从默认值开始似乎是一个好的开始

var options = { dateFormat: 'yy-mm-dd };

但是我如何添加/覆盖数据属性中的值..我只是不知道

【问题讨论】：

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

【解决方案1】：

使用此标记（您必须像这样格式化“数据”属性，以便将它们识别为对象）：

<label> Date <input type="text" data-datepicker='{"maxDate": "+1d"}' /></label>
<label> Another date <input type="text" data-datepicker='{ "dateFormat": "dd-mm-yy"}' /></label>

你可以这样做：

$('[data-datepicker]').each(function() {
    //standard options
    var options = { dateFormat: "yy-mm-dd"};   
    //additional options
     var additionalOptions = $(this).data("datepicker");
    //merge the additional options into the standard options and override defaults
    jQuery.extend(options, additionalOptions);


      $(this).datepicker(options);
});

在这里摆弄：http://jsfiddle.net/WrRte/

【讨论】：