JavaScript - 两个日期之间的循环。开始和结束日期

时间:2018-04-18 13:24:16

标签: javascript

我正在尝试console.log两个日期之间的所有日期。

这是我到目前为止的代码:

    var dString = "18.04.2018";
    var dParts = dString.split('.');
    var in30Days = new Date(dParts[2] + '/' +
                            dParts[1] + '/' +
                            (+dParts[0] + 10)
                   );
    var endDate =  in30Days.getDate() + "." + (in30Days.getMonth()+1) + "." +in30Days.getFullYear();     
    console.log("Now:" + dString + " EndDate: " + endDate);

    for (var d = dString; d <= endDate; d.setDate(d.getDate() + 1)) {
        var loopDay = new Date(d);
        console.log("Day:" + loopDay);
    }

结束日期是开始日期加上10天。

以下是我收到的控制台日志输出:

Now:18.04.2018 EndDate: 28.4.2018
Day:Invalid Date

为什么日期无效。我的错误在哪里?

5 个答案:

答案 0 :(得分:2)

我首先将您拥有的字符串转换为日期,然后再添加几天,直到您将来需要很多天。

const dString = "18.04.2018";
const days = 30;

let [day, month, year] = dString.split('.');

// month - 1 as month in the Date constructor is zero indexed
const now = new Date(year, month - 1, day);

let loopDay = now;
for (let i = 0; i <= days; i++) {
  loopDay.setDate(loopDay.getDate() + 1);
  console.log("Day: " + loopDay);
}

连续31个日期记录到控制台。

答案 1 :(得分:1)

您在循环中使用dString。这不是约会,而是一个字符串。

另外,我会避免使用Date(string)构造函数。我会改用Date(year, month, date)。虽然小心,1月是0,所以你必须将1收回到通过分割字符串获得的月份。

有关工作示例,请参阅下面的代码段。

&#13;
&#13;
var startString = "18.4.2018";
    var startParts = startString.split('.');
    var startDate = new Date(startParts[2], startParts[1]-1, startParts[0]);
    var in30DaysDate = new Date(startParts[2], startParts[1]-1, startParts[0]);; 

    in30DaysDate.setDate(startDate.getDate() + 30)

    console.log("Start:" + startDate + " EndDate: " + in30DaysDate);

    for (var d = startDate; d <= in30DaysDate; d.setDate(d.getDate() + 1)) {
        var loopDay = new Date(d);
        console.log("Day:" + loopDay);
    }
&#13;
&#13;
&#13;

答案 2 :(得分:0)

在for循环中,您使用的是字符串格式的变量dString。首先,您需要将日期字符串转换为日期格式。你可以在这里参考答案。

Converting string to date in js

答案 3 :(得分:0)

 $('#button').on('click',function(){
    var end = $('#end').val()
    var start = $('#start').val()
    var tableau = testdiff(new Date(start),new Date(end));
    console.log(tableau);
  })

  function testdiff(from,to){
    var resultat=[];
    while (from <= to) {
        var dd = from.getDate();
        var mm = from.getMonth()+1; 
        var yyyy = from.getFullYear();
        if(dd<10) {dd='0'+dd;} 
        if(mm<10){mm='0'+mm;} 
        var vDate = yyyy+'-'+mm+'-'+dd; 
        resultat.push(vDate);
        from = new Date(from.setDate(from.getDate() + 1));
    }
    return resultat;
}
<div class="my-2 mx-2">
        <div class="col-sm-4">
            <label for="">start</label>
            <input type="date" name="start" id="start" class="form-control form-control-sm">
        </div>
        <div class="col-sm-4">
            <label for=""> end</label>
            <input type="date" name="end" id="end" class="form-control form-control-sm">
        </div>
        <div class="col-sm-4 my-3">
            <button type="button" id="button" class="btn btn-default">clic</button>
        </div>
        
    </div>

使用jquery

答案 4 :(得分:0)

这是一个代码,用于显示数组中两个不同日期之间的结果:

 $('#button').on('click',function(){
    var end = $('#end').val()
    var start = $('#start').val()
    var tableau = testdiff(new Date(start),new Date(end));
    console.log(tableau);
  })

  function testdiff(from,to){
    var resultat=[];
    while (from <= to) {
        var dd = from.getDate();
        var mm = from.getMonth()+1; 
        var yyyy = from.getFullYear();
        if(dd<10) {dd='0'+dd;} 
        if(mm<10){mm='0'+mm;} 
        var vDate = yyyy+'-'+mm+'-'+dd; 
        resultat.push(vDate);
        from = new Date(from.setDate(from.getDate() + 1));
    }
    return resultat;
}
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<div class="my-2 mx-2">
        <div class="col-sm-4">
            <label for="">Start date</label>
            <input type="date" name="start" id="start" class="form-control form-control-sm">
        </div>
        <div class="col-sm-4">
            <label for=""> End date</label>
            <input type="date" name="end" id="end" class="form-control form-control-sm">
        </div>
        <div class="col-sm-4 my-3">
            <button type="button" id="button" class="btn btn-primary form-control">clic</button>
        </div>
        
    </div>
    <script
  src="https://code.jquery.com/jquery-3.5.1.js"
  integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc="
  crossorigin="anonymous"></script>