Question

例如，用户选择27/01/2016，＆＃39;结束日期＆＃39;文本框将显示27/01/2017，这将是不可编辑的。最好不要使用JQueryDate函数

Answer 1

尝试使用String.prototype.slice()，在第一个disabled元素input type="date"的{{1}}元素处设置.nextElementSibling属性

修改，更新

添加input type="date"，new Date()来处理闰年，正如@itachi所指出的那样

＆＃13;

.toJSON()

＆＃13;

var input = document.querySelector("input");
input.onchange = function(e) {
  var val = this.value;
  // add `1` to first four characters of `this.value` : `yyyy` 
  this.nextElementSibling.value = new Date(1 + +val.slice(0, 4) 
                                  + val.slice(4)).toJSON().slice(0, 10)
}

＆＃13;

Answer 2

一个解决方案，就是有两个日期输入。

用户可以使用第一个选择日期。一旦用户选择了日期，这个就会消失。

第二个将是隐身的readonly。一旦用户选择了一个日期，就会使用日期+ 1y启动该日期并显示。

您可以使用简单的javascript添加+ 1，请参阅Date javascript对象

Answer 3

正如Dionys所说，你的输出有一个readonly输入字段，如：

<p>
  <input type="text" id="date" />
</p>
<p>
  <input type="text" id="output" readonly="readonly" />
</p>

然后，假设正在以该格式选择日期，这是一个糟糕的跳跃，但我现在唯一可以做的是split()和join()小动作：

var date = document.getElementById('date');

date.addEventListener('change', function(){
    var val = date.value, y = '', parts = [];
    if(val) {
        parts = val.split('/');
        y = parts.length - 1;
        parts[y] = parseInt(parts[y], 10) + 1;
        document.getElementById('output').value = parts.join('/');
    }
}, false);

给予或接受，只要日期与最后一年一起呈现，就应该运行得很好。如果您发布了代码链接或更新了问题，我可以将其缩小到更准确。

<强> Fiddles

Answer 4

一切都取决于您的输入类型。它是来自JavaScript的纯Date对象，还是仅为格式为String的简单dd/MM/yyyy？

日期输入

这很简单 - 唯一要做的就是增加一年，然后将日期转换为您的格式。

var d = new Date(); // It's for presentation. You already have it from your input.
d.setFullYear(d.getFullYear()+1);
var str = [d.getDate(), d.getMonth()+1, d.getFullYear()].join('/');

字符串输入

这是上面的一个小修改示例。你必须首先解析你的字符串，你将如何做，取决于你的日期格式。我在这里假设，这是dd/MM/yyyy。

var s = '28/01/2016';
var chunks = s.split('/');

d = new Date(chunks[2], chunks[1]-1, chunks[0], 0, 0, 0, 0);

d.setFullYear(d.getFullYear()+1);
var str = [d.getDate(), d.getMonth()+1, d.getFullYear()].join('/');

使用JavaScript在用户选择的开始日期+ 1年的文本框中显示结束日期

4 个答案:

日期输入

字符串输入