Javascript / jQuery DatePicker 自定义答案

【问题标题】：Javascript / jQuery DatePicker CustomizationJavascript / jQuery DatePicker 自定义
【发布时间】：2017-01-08 23:12:08
【问题描述】：

我需要一个日期选择器来添加到一个 PHP 文件中，以便在我的一个数据库表中选择各种时间范围。我曾经手动输入这些信息，但因为我需要经常选择它，所以我想创建一个更快的更简洁的版本。我通过这个网站找到了日期选择器的源代码..

http://api.jqueryui.com/datepicker/#option-dateFormat

它给了我下面的代码来使用...

    <script>
  $( function() {
    $( "#datepicker" ).datepicker();
  } );
    $( function() {
    $( "#datepicker2" ).datepicker();
  } );
  </script>

一个是开始日期，第二个是结束日期，我正在尝试修改日期的格式，以便它们显示为 yy-mm-dd。 API 文档说我可以通过使用以下代码来完成此操作...

    $( ".selector" ).datepicker({
  dateFormat: "yy-mm-dd"
});

    // Getter
var dateFormat = $( ".selector" ).datepicker( "option", "dateFormat" );

// Setter
$( ".selector" ).datepicker( "option", "dateFormat", "yy-mm-dd" );

如何将其添加到我的代码中？是直接进入脚本标签吗？我尝试将它放在那里并进行各种编辑，但没有成功，API 文档没有详细说明在哪里添加它或修改什么。

为此提供动力的整个源代码块是..

 <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  <script>
  $( function() {
    $( "#datepicker" ).datepicker();
  } );
    $( function() {
    $( "#datepicker2" ).datepicker();
  } );
  $( ".datepicker" ).datepicker({
  dateFormat: "yy-mm-dd"
});
$( ".datepicker" ).datepicker( "option", "dateFormat", "yy-mm-dd" );
  </script>
 <form action="dateselection.php" method="POST">
<p>Date: <input type="text" id="datepicker" name="dp"></p>
<p>Date2: <input type="text" id="datepicker2" name="dp2"></p>
 <input type="submit">
 </form>

【问题讨论】：

标签： javascript jquery jquery-ui datepicker

【解决方案1】：

您可以在初始的datepicker() 声明中简单地声明dateFormat，例如：

<form action="dateselection.php" method="POST" id="datePost">
    <p>Date: <input type="text" id="datepicker" name="dp"></p>
    <p>Date2: <input type="text" id="datepicker2" name="dp2"></p>
    <input type="submit" value="Submit">
</form>
<script>
    $("#datepicker").datepicker({ dateFormat: "yy-mm-dd" });
    $("#datepicker2").datepicker({ dateFormat: "yy-mm-dd" });
</script>

【讨论】：