datepicker指定的值不符合要求的格式jquery.js

Question

所以昨天我问了一个有关设置日历日期的问题。我缺少一些参考资料，因此已经添加了它们。请参阅下面的HTML部分。

我相信我的代码对于如何设置日历日期是正确的。但是，在加载页面时出现这些错误，

未捕获的SyntaxError：意外的令牌datepicker.css：11

指定的值“ 09/01/2018”不符合要求的格式“ yyyy-MM-dd”。的jquery.js：8254

不确定为什么这不起作用以及日期“ 09/01/2018”从哪里来？

我也认为我的datepicker.css应该如下所示。

链接href =“ https://cdnjs.cloudflare.com/ajax/libs/datepicker/0.6.5/datepicker.css” rel =“ stylesheet” type =“ text / css” />

当我这样做时，Uncaught SyntaxError消息消失，但仍然有其他问题。

$(document).ready(function() {
  $("#dtSelectorStatic").datepicker();
  $("#dtSelectorStatic").datepicker("setDate", new Date(2018, 8, 1));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/datepicker/0.6.5/datepicker.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/datepicker/0.6.5/datepicker.min.css" />

<input id="dtSelectorStatic" />

更新资料

以下是我页面中的所有参考。一件事（可能什么都不是），但是当我输入“ script src =“时，我的意思会出现在我的文件夹脚本中，并列出3个文件（下图，jQES是我创建的文件），但同时也没有列出其他两个文件该文件夹，jquery-ui.js或jquery-ui.min.js

 <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
    google.charts.load('current', { 'packages': ['corechart', 'table'] });
</script>
<script src="/scripts/external/jquery/jquery.js"></script>
<script src="/scripts/jquery-ui.min.js"></script>
<script src="/scripts/jQES.js"></script> 
<link href="CSS/MyCSSFile.css" rel="stylesheet" type="text/css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" />

更新2

这就是加载时的样子。

如果我单击蓝色箭头指向下面的日历的区域，则会显示该日历。

如果我单击黑色的大箭头，我会得到两个日历

我有另一个完全相同的日历框。无论我做什么，它仅显示下面显示的日历。唯一的区别是，在加载时，我不会像在上面的日历中那样尝试设置日期。

   <input id="someId" type="date"/>

Answer 1

jquery-ui datepicker docs（至少滚动1行，Additional Notes上没有id，这是我可以链接到的最接近的元素）包含有关此问题的信息：

附加说明：
...

<input type="date">由于与本机选择器的UI冲突，因此不支持在上创建日期选择器。

这是具有属性的默认HTML5输入type="date"：

<input type="date">

从MDN关于HTML5日期输入的值：

需要注意的一件事是，显示的日期格式与实际值不同– 显示的日期格式将根据用户浏览器的设置区域设置进行选择，而日期值始终采用yyyy-mm-dd格式。

添加jquery-ui datepicker时，您会看到它们两个。
更糟糕的是它的默认值格式是yyyy-mm-dd（请参见mdn上的更多信息），因此，如果更改格式，则jquery-ui datepicker会设置以dateFormat属性（或基于语言环境）格式设置的值。它开始显示警告（在代码段的控制台中不可见，最好是console.warn仅在开发人员工具中可见）

$(document).ready(function() {
  $("#dtSelectorStatic").datepicker({dateFormat: "dd-M-yy"});

  $("#dtSelectorStatic").datepicker("setDate", new Date(2018, 8, 1));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" />


<input type="date" id="dtSelectorStatic" />

可能的解决方案：如果删除属性type="date"或将其设置为，"text"则可以获得jquery-ui datepicker的功能（请参见下面的代码段）。

$(document).ready(function() {
  $("#dtSelectorStatic").datepicker({dateFormat: "yy-mm-dd"});

  $("#dtSelectorStatic").datepicker("setDate", new Date(2018, 8, 1));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" />


<input id="dtSelectorStatic" />