Javascript - 从当前日期开始计算日期1年/ 3个月/ 1个月前(dd-mm-yyyy)

Question

我有一个下拉框,包含3个选项...每月,每季度和每年.当选择任一选项时,我试图填充2个字段.开始日期将是当前日期,我想根据所选的选项计算结束日期.到目前为止,我有这个.

HTML:

<select name="date_range" class="date_range">
    <option value="None">Please select a date range</option>
    <option value="Yearly">Yearly</option>
    <option value="Quarterly">Quarterly</option>
    <option value="Monthly">Monthly</option>
</select>

<p>Start Date</p>
    <input type="text" name="start_date" id="start_date" />
<p>End Date</p>
    <input type="text" name="end_date" id="end_date" />

JavaScript的:

$(function() {
    $('.date_range').change(function(){
    var date = new Date();
    console.log(date);
    });
});

console.log给了我以下内容:

Wed May 01 2013 19:42:42 GMT+0100 (GMT Daylight Time)

'start_date'和end_date'字段都使用datepicker,目前格式为dd-mm-yyyy.如何计算从当前日期到正确格式的正确日期范围(月,季度或年度)并设置两个字段的值(使用'dd-mm-yyyy'格式).

我遇到过Moment.js和datejs,如果问题太复杂,我可以使用它.提前为任何帮助干杯.

Answer 1

jsFiddle示例

这利用了函数:setFullYear()在日期对象上.

注意:我同意将值更改为要更改它的月数是最佳解决方案,因为它允许更多动态代码.此外,我的代码不处理无选择,因为我不知道你想要它做什么.

HTML:

<select name="date_range" class="date_range">
    <option value="None">Please select a date range</option>
    <option value="Yearly">Yearly</option>
    <option value="Quarterly">Quarterly</option>
    <option value="Monthly">Monthly</option>
</select>

<p>Start Date</p>
    <input type="text" name="start_date" id="start_date" />
<p>End Date</p>
    <input type="text" name="end_date" id="end_date" />

JS:

$('.date_range').change(function(){
    var now = new Date();
    var start = new Date();
    switch($('.date_range').find(":selected").text())
    {
        case 'Yearly':
            start.setFullYear(start.getFullYear()-1);
            break;
        case 'Quarterly':
            start.setFullYear(start.getFullYear(), start.getMonth()-3);
            break;
        case 'Monthly':
            start.setFullYear(start.getFullYear(), start.getMonth()-1);
            break;
    }
     $('#start_date').val(start.toLocaleDateString());
     $('#end_date').val(now.toLocaleDateString());
});

如果您愿意更改HTML jsFiddle示例

HTML:

<select name="date_range" class="date_range">
    <option value="0">Please select a date range</option>
    <option value="12">Yearly</option>
    <option value="3">Quarterly</option>
    <option value="1">Monthly</option>
</select>

<p>Start Date</p>
    <input type="text" name="start_date" id="start_date" />
<p>End Date</p>
    <input type="text" name="end_date" id="end_date" />

JS:

$('.date_range').change(function(){
    var now = new Date();
    var start = new Date();

    start.setFullYear(start.getFullYear(), start.getMonth()-$('.date_range').find(":selected").val());

     $('#start_date').val(start.toLocaleDateString());
     $('#end_date').val(now.toLocaleDateString());
});