更改日期选择器中的日期格式

Question

我有一个关于将日期格式更改为 dd/mm/yyyy 的问题。我希望默认日期为 09-01-2022。但下面的代码无法更改 dd/mm/yyyy。

var today = "Wed Jan 09 2022 13:01:18 GMT+0800 (Malaysia Time)";
var dd = String(today.getDate()).padStart(2, '0');
var mm = String(today.getMonth() + 1).padStart(2, '0'); //January is 0!
var yyyy = today.getFullYear();
today = mm + '/' + dd + '/' + yyyy;

<div class="col-xs-12 col-md-2">
<label>Date&nbsp;:</label>
<input type="date" class="form-control" id="date_of_daily" name="date_of_daily" value="2022-01-09" title="Date of daily" min="2022-01-09" max="2022-01-11">
</div>

实际上我想要如下图所示的结果：

希望有人能指导我如何解决这个问题。谢谢。

Answer 1

你可以尝试一下：

var today = "Wed Jan 09 2022 13:01:18 GMT+0800 (Malaysia Time)";

function convertDate(inputFormat) {
  function pad(s) { return (s < 10) ? '0' + s : s; }
  var d = new Date(inputFormat)
  return [pad(d.getDate()), pad(d.getMonth()+1), d.getFullYear()].join('/')
}

console.log(convertDate(today))

$(function() {
  $("#date_of_daily").datepicker({
    dateFormat: "dd/mm/yy",
    minDate: 0,
    maxDate: "+2D +0M",
    showAnim: "slideDown"
  });
});

<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="https://jqueryui.com/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
<script src="https://code.jquery.com/ui/1.13.1/jquery-ui.js"></script>
<div class="col-xs-12 col-md-2">
  <label>Date :</label>
  <input type="text" class="form-control" id="date_of_daily" name="date_of_daily" size="30" value="09/01/2022" title="Date of daily" min="2022-01-09" max="2022-01-11">
</div>

Answer 2

我希望下面的内容能回答您的问题...您今天需要基本上解析字符串以将其转换为日期，然后再调用 Date 函数（例如 getDay 等）...

var today = "Wed Jan 09 2022 13:01:18 GMT+0800 (Malaysia Time)";
var dd = String(Date.parse(today)).padStart(2, '0');
var mm = String(new Date(Date.parse(today)).getMonth() + 1).padStart(2, '0'); //January is 0!
var yyyy = new Date(Date.parse(today)).getFullYear();
today = mm + '/' + dd + '/' + yyyy;

<div class="col-xs-12 col-md-2">
<label>Date :</label>
<input type="date" class="form-control" id="date_of_daily" name="date_of_daily" value="2022-01-09" title="Date of daily" min="2022-01-09" max="2022-01-11">
</div>