如何将日期从 javascript 设置为 html <input type="date"/> 元素答案

【问题标题】：how to set date from javascript to html <input type="date"/> element如何将日期从 javascript 设置为 html <input type="date"/> 元素
【发布时间】：2018-07-27 04:32:16
【问题描述】：

谁能告诉我如何将日期从 javascript 设置为 HTML 元素，是否可以这样做，因为它适用于 tag 而不是 tag ，实际上我有一个要求，我希望用户从一个输入元素中选择一个日期，它会自动在另一个日期输入元素中设置日期，并延长 1 年。

例如，如果我从第一个输入中选择一个日期作为 02/16/2018，那么它应该自动填充另一个日期输入作为 02/16/2019。

提前致谢！

【问题讨论】：

输入元素的value 属性将包含日期。所以选择原始元素，得到它的价值。然后选择日期必须去的元素并将输入值更改为第一个元素的值。由于您没有显示您遇到问题的代码，因此我们无法帮助调试您的代码，只建议尝试的事情。

标签： javascript html date

【解决方案1】：

您可以使用https://momentjs.com/获取所需的日期并填写$('selector').val(newdate)到另一个日期输入；

【讨论】：

【解决方案2】：

我以另一种方式做到了：

document.getElementById('1').addEventListener('change', function() {
	var date1 = document.getElementById('1');
        var dateSplit = document.getElementById('1').value.split("-");
        dateSplit[0] = parseInt(dateSplit[0]);
        dateSplit[0] = dateSplit[0] + 1;
        dateSplit[0] = dateSplit[0].toString();
        var date2 = document.getElementById('2').value = dateSplit[0] + "-" + dateSplit[1] + "-" + dateSplit[2];
});

<!doctype html>
<html>
  <body>
    <input type="date" id="1">
    <input type="date" id="2">  
  </body>
</html>

【讨论】：

嘿，这正是我要问的。非常非常感谢。

【解决方案3】：

这里是代码

const { format } = dateFns

function getDate() {
  var oldDate = document.getElementById("oldDate").value;
  var date = new Date(oldDate)
  var newDate = new Date(date.getFullYear()+1,date.getMonth(),date.getDay())
  document.getElementById("newDate").value = format(newDate, 'YYYY-MM-DD');
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/date-fns/1.29.0/date_fns.js"></script>
<input type="date" onChange="getDate();" id="oldDate" />
<input type="date" id="newDate" />

【讨论】：

【解决方案4】：

希望对你有帮助。

$('#field1').on('change',function(e) {
  $('#field2').val($(this).val());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="date" Id="field1"/>
<input type="date" Id="field2"/>

【讨论】：

他想把 2019 年放在第二个盒子里。
将值转换为日期并提取年、日和月。并将年份加 1，使用 Date 构造函数并使用 val() 设置值