Jquery 通过ProgramMaticali设置FlatPicker默认日期_Jquery_Flatpickr

Jquery 通过ProgramMaticali设置FlatPicker默认日期

jquery

Jquery 通过ProgramMaticali设置FlatPicker默认日期,jquery,flatpickr,Jquery,Flatpickr,我通过一个html组件使用Wix代码中的FlatPicker。使用postMessage/onMessage进行通信非常有效。我可以从datepicker（html组件）将所选日期发送回Wix。另外，我可以从Wix发送到组件。问题是，我将postMessage设置为一个有效的日期，它完全到达，但随后需要将其设置为FlatPicker defaultDate属性。而这一点，我无法解决。线路或不设置默认日期事件。数据包含要设置的有效日期这是一个语法问题，我知道，但我无法理解代码如下： &l

我通过一个html组件使用Wix代码中的FlatPicker。使用postMessage/onMessage进行通信非常有效。我可以从datepicker（html组件）将所选日期发送回Wix。另外，我可以从Wix发送到组件。问题是，我将postMessage设置为一个有效的日期，它完全到达，但随后需要将其设置为FlatPicker defaultDate属性。而这一点，我无法解决。线路

或

不设置默认日期<代码>事件。数据包含要设置的有效日期

这是一个语法问题，我知道，但我无法理解

代码如下：

<!doctype html>
<html>
  <head>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.2.3/flatpickr.css">
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.2.3/themes/material_green.css"> 
  </head>
<script type="text/javascript">
    window.onmessage = (event) => {
    if (event.data) {
        $("#startDate").flatpickr.defaultDate = event.data;
    }
};

function sendLoadMessage () {
    window.parent.postMessage("LoadOk", "*");
}
</script>
<body onload="sendLoadMessage ();" style="font-family: verdana;background-color:white;margin:0;padding:0">
  <div>
    <input type="text" hidden="true" id="startDate" data-input>
</div>
  
    <!-- jQuery -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  <!--  Flatpickr  -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/flatpickr/4.2.3/flatpickr.js"></script>
<script src="https://npmcdn.com/flatpickr/dist/l10n/es.js"></script>
<script>
$("#startDate").flatpickr({
    enableTime: false,
    dateFormat: "d/m/Y",
    inline: true,
    locale: "es",  
<!-- defaultDate : "01/05/2018",-->
    onChange: function(selectedDates, dateStr, instance) {
        window.parent.postMessage(selectedDates, "*");
    },
});


</script>
</body>
 </html>


window.onmessage=（事件）=>{
if（事件数据）{
$（“#startDate”）.flatpickr.defaultDate=event.data；
}
};
函数sendLoadMessage（）{
window.parent.postMessage（“LoadOk”，“*”）；
}
$（“#开始日期”）.flatpicker({
启用时间：false，
日期格式：“d/m/Y”，
是的，
区域设置：“es”，
onChange:function（selectedDates、dateStr、instance）{
window.parent.postMessage（selectedDates，“*”）；
},
});

您必须首先在创建FlatPicker实例时保存它

var flatpickr = $("#startDate").flatpickr({});

然后您必须使用配置设置器

flatpickr.set('defaultDate', event.data);

var flatpickr = $("#startDate").flatpickr({});

flatpickr.set('defaultDate', event.data);