时间戳

首页 > 解决方案 > 如何使用javascript在文本框中15天后自动显示日期？

javascript - 如何使用javascript在文本框中15天后自动显示日期？

问题描述

我这里有两个文本框，一个是发布日期，第二个是结束日期。当用户选择发布日期时，我想在发布日期后 15 天的结束日期显示日期。

例如：如果用户在发布日期选择 oct 1 2018，则 oct 15 2018 必须自动显示在结束日期。

 <div class="control-group">
            <label class="control-label">Published Date</label>
            <div class="controls">
            <input type="text" id="published_date" name="published_date" data-date="01-01-2017" data-date-format="yyyy-mm-dd" value="<?php echo date('Y-m-d');?>" class="datepicker span11">
            </div>
          </div>
          <div class="control-group">
            <label class="control-label">Ending Date</label>
            <div class="controls">
            <input type="text" id="ending_date" name="ending_date" disabled>
            </div>
        </div>

标签： javascriptphpjquerylaravel

解决方案

您可以使用此 js 片段将 15 天添加到日期对象。

let date = new Date(document.getElementById("published_date").value); // making a date object with string
date.setDate(date.getDate() + 15); // setting date 15 days after
document.getElementById("ending_date").value = new_date.toISOString().slice(0, 10); // formatting to yyyy-mm-dd

因为DateJS 中的构造函数使用自由格式的字符串获取输入，所以您可以使用元素Date的字符串值创建一个对象。#published_date

制作Date对象后，使用Date.prototype.setDate()和Date.prototype.getDate()将日期设置为初始日期后 15 天。

最后使用格式和切片字符串设置#ending_date元素的值。yyyy-mm-ddDate.prototype.toISOString()

希望这可以帮助！

推荐阅读