Javascript 如何在materialize datepicker中设置日期

我正在使用Materializecs.com日期选择器。当我尝试用jquery设置日期时，日期没有被设置。这是我的密码：-

// Materialize Date Picker
    window.picker = $('.datepicker').pickadate({
        selectMonths: true, // Creates a dropdown to control month
        selectYears: 100, // Creates a dropdown of 15 years to control year
        format: 'dd/mm/yyyy'    
    });

<input type="text" id="Date" class="datepicker" />

当我打开日期选择器时，它会显示今天的日期

---

如何在materialize datepicker中设置日期？

materialize datepicker是一个经过修改的选择器

根据他们的情况，以下是如何设置选择器：

获取选择器：

var$input=$（'.datepicker'）.pickadate（）
//直接使用选择器对象。
var picker=$input.pickadate（'picker'）

只需在元素的属性中添加日期所需的格式即可

$('.datepicker').pickadate({
    selectMonths: true, // Creates a dropdown to control month
    selectYears: 15, // Creates a dropdown of 15 years to control year
    format: 'dd-mm-yyyy' });

var$input=$（'.datepicker'）.pickadate（）
//直接使用选择器对象。
var picker=$input.pickadate（'picker'）

---

这应该在一行中满足您的需要。触发更改您可能需要或不需要，取决于您的情况，就像我一样，我需要它来进行触发验证。还包括格式化日期，以防有人需要。

您可以使用

V1.0.0-rc.2

中提供的日期选择器方法

document.addEventListener（'DOMContentLoaded'，function（）{
变量选项={
违约日期：新日期（2018年1月3日），
setDefaultDate:true
};
var elems=document.querySelector（'.datepicker'）；
var instance=M.Datepicker.init（元素、选项）；
//open（）；
例如，设置日期（新日期（2018年2月8日））；
});
pickadate（）的所有答案在Materialize的新版本中不再有效。该方法现在命名为datepicker（）。以下是我的代码片段：

var element = document.querySelector('.datepicker');
M.Datepicker.getInstance(element).setDate(new Date(2018,8,7), true);

您可以在初始化时传入要默认设置的选项。
例如，下面的js代码可用于标记：


const elems2=document.querySelectorAll（'.datepicker'）；
用于（元素2的元素）{
const date=element.dataset.defaultDate
如果（日期！==未定义）{
init（元素，{defaultDate:newDate（日期），yearRange:15}）
}
否则{
M.Datepicker.init（元素，{}）
}
}

10年前的日期选择器
注意你的css和js版本的materialize:
如果在
中

<link rel="stylesheet"  href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.100.2/css/materialize.min.css">



然后坚持使用相同的JS版本
这样您就可以使用
$（'.datepicker'）.pickadate（'picker'）.set（'select'，'your parsed date'，{format:'your format'））.trigger（'change'）

如果版本为1.0.0，则必须使用
$（'.datepicker'）.datepicker（）
如果您使用
angular
或类似工具来管理web应用程序，但无法实例化
Datepicker
对象，根据文档，使用
jQuery
可以参考该对象的以下方法：

$('.datepicker').datepicker('setDate', new Date());

在第一个参数中，在本例中，您可以指定要使用的方法名称。在第二个参数中，在本例中为
new Date（）
，您将把值传递给函数（如果有）

在本例中，该行将使用类
.datepicker
将所有日期选取器的日期更新为今天。
根据文档
检查日期格式选项

// date picker
$(document).ready(function(){

  $('.datepicker').datepicker( {"format":'dd-mm-yyyy'} ).datepicker("setDate", new Date());

});

如果您不需要日历中突出显示的当前日期，您可以删除代码并将其更改为下面的日期

// date picker
$(document).ready(function(){

  $('.datepicker').datepicker( {"format":'dd-mm-yyyy'});

});

我已经在
custom.js
文件中定义了日期选择器。当我尝试根据您的答案从外部设置日期时，它显示了错误：-
未捕获引用错误：未定义选择器
我声明了
全局变量
如下：-
window.picker=$input.pickadate（'picker'）。。现在可以工作了..谢谢。虽然此代码可以回答问题，但提供有关如何和/或为什么解决问题的其他上下文将提高答案的长期值。setDefaultDate:true不会导致显示默认日期的输出。有解决办法吗？我有两个日期字段。当我添加此脚本时，日历仅显示第一个字段，而不是第二个字段。第二个字段也有显示日历的方法吗？找到了！！只需更改第二个字段的类并将其添加到脚本中。它就像一个符咒！setDefaultDate设置默认输入值，但我不认为这是问题所在。如果在Chrome中使用它，则在（'mousedown'，function（event）{event.preventDefault（）；}）上添加$（'.datepicker'）（已知问题：）
// date picker
$(document).ready(function(){

  $('.datepicker').datepicker( {"format":'dd-mm-yyyy'} ).datepicker("setDate", new Date());

});

// date picker
$(document).ready(function(){

  $('.datepicker').datepicker( {"format":'dd-mm-yyyy'});

});