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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/16324421/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 04:12:35  来源:igfitidea点击:

Javascript - Calculate date 1 year/3 months/1 month ago from current date (dd-mm-yyyy)

javascriptjquerydate

提问by Pooshonk

I have a dropdown box that contains 3 options..monthly, quarterly and yearly. I am trying to populate 2 fields when either of the options are selected. The start date will be the current date, and I want to work out the end date depending on the option selected. So far I have this.

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

HTML:

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:

JavaScript:

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

The console.log gives me the following:

console.log 给了我以下信息:

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

Both the 'start_date' and end_date' fields use datepicker and currently have a format of dd-mm-yyyy. How would I calculate the correct date range (month, quarterly or yearly) from the current date to the correct format and set the value of the both fields (with the 'dd-mm-yyyy' format).

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

I have come across Moment.js and datejs which I may look into using if the problem is too complicated. Cheers for any help in advance.

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

回答by abc123

jsFiddle Example

jsFiddle 示例

This takes advantage of the function: setFullYear()on the date object.

这利用了功能:setFullYear()在日期对象上。

Note: I agree that changing the value to the number of months you want to change it to is the best solution because it would allow for more dynamic code. Also my code doesn't handle None selection because I don't know what you want it to do.

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



HTML:

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:

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());
});


If you are willing to change the HTML jsFiddle Example

如果您愿意更改 HTML jsFiddle Example

HTML:

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:

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());
});

回答by Ryan

Have you tried getFullYear()?

你试过getFullYear()吗?

var d = new Date(2013, 5, 1);
d.setFullYear(d.getFullYear() - 1);

回答by dtech

I'd recommend a slight change in HTML, using number of months instead of strings:

我建议对 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="date" name="start_date" id="start_date" />
<p>End Date</p>
    <input type="date" name="end_date" id="end_date" />

Now your code is relatively simple. Example fiddle. Needs a relatively modern browser that supports <input type="date">(on older browser will work if date is entered as yyyy-mm-dd)

现在您的代码相对简单。示例小提琴。需要一个支持的相对现代的浏览器<input type="date">(如果日期输入为 ,则旧浏览器将工作yyyy-mm-dd

$('#start_date').change(function() {
    var end_date_value = new Date($('#start_date').val()); // Start with start_date value
    end_date_value.setMonth(end_date_value.getMonth() + $('select.date_range option:selected').val()); // Add range months
    $('#end_date').val(end_date_value.toISOString().substring(0, 10));
});

$('#end_date').change(function() {
    var start_date_value = new Date($('#end_date').val()); // Start with end_date value
    start_date_value.setMonth(start_date_value.getMonth() - $('select.date_range option:selected').val()); // Substract range months
    $('#start_date').val(start_date_value.toISOString().substring(0, 10));
});

回答by KJ Price

For the date format, use the built-in "format" method in the jquery.datepicker object: $("#start_date").datepicker.formatDate("dd-mm-yyyy", new Date())

对于日期格式,使用jquery.datepicker对象中内置的“format”方法: $("#start_date").datepicker.formatDate("dd-mm-yyyy", new Date())