Javascript - 将 30 天添加到输入日期答案

【问题标题】：Javascript - Adding 30 Days to Input DateJavascript - 将 30 天添加到输入日期
【发布时间】：2017-11-23 05:35:32
【问题描述】：

我似乎找不到任何最近的东西，而且我可能落后于时代并且只是在搜索错误的术语等，所以我希望这里有人可以提供帮助或可能有一些建议。

我有两个日期字段，一个是发票日期，一个是到期日。我希望在发票日期中选择或更改一个日期，并且到期日期会自动更新以反映发票日期后 30 天的日期。

<input id="dateInvoice" type="date"/>
<input id="dueDate" type="date"/>

【问题讨论】：

您想增加 30 天还是 1 个月？两者不相同。
getDate / setDate 是你所需要的 - javascript 为你处理溢出
@gurvinder372 - 你是对的，我已经改变了我的问题以反映一个统一的问题
我有两个日期字段，一个是发票日期，一个是到期日 这些是输入日期类型标签吗？你能分享相关的标记吗？
dueDate = new Date(invoideDate); dueDate.setDate(dueDate.getDate() + 30)

标签： javascript date input

【解决方案1】：

你可以按照这个方法

使用split 和日期构造函数 解析输入日期 值
使用setDate 添加天数
设置新的日期值为输出日期。

演示

document.querySelector("#addDays").addEventListener("click", function() {
  var invoiceDate = document.querySelector("#invoiceDate").value;
  var days = Number(document.querySelector("#days").value);
  var dueDateElement = document.querySelector("#dueDate");

  if (!isNaN(days) && invoiceDate.length) {
    invoiceDate = invoiceDate.split("-");
    invoiceDate = new Date(invoiceDate[0], invoiceDate[1] - 1, invoiceDate[2]);
    invoiceDate.setDate(invoiceDate.getDate() + days);
    dueDateElement.valueAsDate = null;
    dueDateElement.valueAsDate = invoiceDate;
    //console.log(invoiceDate, dueDateElement.value);
  }
});

Invoice Date <input type="date" id="invoiceDate"> <br><br> Add Days <input type="text" id="days"> <br><br>

<button id="addDays">Add Days</button> <br><br> Due Date <input type="date" id="dueDate">

【讨论】：

我喜欢这个，所以我知道这意味着我的请求可以以某种形式出现。使用上面的代码作为模板，是否有一种方法可以在发票日期更改后自动执行相同的操作？
您也可以在 发票日期 的 change 事件中调用相同的代码。
嗨 - 我使用 change 事件让你按照我需要的方式工作，但它看起来像我的（以及你提供的演示在引入新年时遇到了问题。对于例如，尝试将 12/22/2017 作为发票日期，将天数设为 30，您会看到到期日期将保持为 mm/dd/yyyy
奇怪的是，2017 年 11 月 10 日之前的任何日期都会出现同样的问题。
哦，那让我检查一下。

【解决方案2】：

您可以像这样在 Javascript 中创建日期

var date = new Date(2017,11,27,11,14,00,00)

您可以在此日期上加上 30 天以获取日期（30 天后）

after30days = date.setDate(cur.getDate() + 30);

【讨论】：

在输入/更新发票日期后如何使用它？我似乎无法使用日期字段来更改日期字段。
@Matthew 你用的是哪个插件 Date ？，如果是简单的输入日期，试试 document.getElementById("date").value
那么这对于最终输出是否正确？似乎它不想在到期日做任何事情：<script> function invoicedue(e){ alert(e.target.value); var invoiceDate = new Date(document.getElementById("dateInvoice").value); var dueDate1 = invoiceDate.setDate(cur.getDate() + 30); $('#dueDate').val(dueDate1); } </script>
当我们设置输入日期时，该值必须是“yyyy-MM-dd”格式，使用此函数完成最后一步stackoverflow.com/a/3067896/713789

【解决方案3】：

您可以将 javascript 日期拆分为月日和年，并为其添加简单的月份作为

var invoiceDate = new Date("01/31/2017");
var dueDate= invoiceDate.addMonths(1);

【讨论】：

或者您可以添加相同的 gor 日期，例如：var dueDate= invoiceDate.addDays(30);
在输入/更新发票日期后如何使用它？我似乎无法使用日期字段来更改日期字段。
我没有得到你的问题，请你解释一下你到底想说什么
举个例子，当有人添加或更改发票日期字段时，到期日期字段将自动更新为添加 30 天（或一个月，我真的不在乎这么久当我得到某种形式的解决方案时）
@Matthew 如果你输入日期，你可以使用 onchange 事件，见stackoverflow.com/a/40762843/713789