【问题标题】:Calculate the difference between two dates in number of days计算两个日期之间的天数差
【发布时间】:2014-08-08 11:06:03
【问题描述】:

我想做的是,当用户点击一个按钮时,我想计算并显示两个日期之间的差异。

function calcBusinessDays(dDate1, dDate2) { // input given as Date objects
    var iWeeks, iDateDiff, iAdjust = 0;

    if (dDate2 < dDate1) return -1; // error code if dates transposed

    var iWeekday1 = dDate1.getDay(); // day of week
    var iWeekday2 = dDate2.getDay();
    iWeekday1 = (iWeekday1 == 0) ? 7 : iWeekday1; // change Sunday from 0 to 7
    iWeekday2 = (iWeekday2 == 0) ? 7 : iWeekday2;

    if ((iWeekday1 > 5) && (iWeekday2 > 5)) iAdjust = 1; // adjustment if both days on weekend

    iWeekday1 = (iWeekday1 > 5) ? 5 : iWeekday1; // only count weekdays
    iWeekday2 = (iWeekday2 > 5) ? 5 : iWeekday2;

    // calculate differnece in weeks (1000mS * 60sec * 60min * 24hrs * 7 days = 604800000)
    iWeeks = Math.floor((dDate2.getTime() - dDate1.getTime()) / 604800000)

    if (iWeekday1 <= iWeekday2) {
        iDateDiff = (iWeeks * 5) + (iWeekday2 - iWeekday1)
    } else {
        iDateDiff = ((iWeeks + 1) * 5) - (iWeekday1 - iWeekday2)
    }

    iDateDiff -= iAdjust // take into account both days on weekend

    return (iDateDiff + 1); // add 1 because dates are inclusive
}

$("#datepicker, #datepicker1").change(function() {
    alert("getPricing just got called");
    var d1 = $("#datepicker").val();
    var d2 = $("#datepicker1").val();

    var minutes = 1000*60;
    var hours = minutes*60;
    var day = hours*24;

    var startdate1 = getDateFromFormat(d1, "d-m-y");
    var enddate1 = getDateFromFormat(d2, "d-m-y");

    var newstartdate=new Date();
    newstartdate.setFullYear(startdate1.getYear(),startdate1.getMonth(),startdate1.getDay());

    var newenddate=new Date();
    newenddate.setFullYear(enddate1.getYear(),enddate1.getMonth(),enddate1.getDay());

    var days = calcBusinessDays(newstartdate,newenddate);

    if(days>0) {
        $("#leaves_left").val(days);
    } else {
        $("#leaves_left").val(0);
    }
});

$(function() {
    //alert("getPricing just got called");

    $("#datepicker").datepicker({
        beforeShowDay: $.datepicker.noWeekends, 
        dateFormat: 'yy-mm-dd',
        minDate: 0,
        beforeShow: function() {
            $('.datepicker').datepicker('option', 'maxDate', $('#end_date').val());
        }
    });

    $("#datepicker1" ).datepicker({
        beforeShowDay: $.datepicker.noWeekends, 
        dateFormat: 'yy-mm-dd',
        beforeShow: function() {
            $(this).datepicker('option', 'minDate', $('#datepicker').val());
        }
    });

    $("#button").submit(function(){ 
        alert("getPricing just got called");
        var start   = $('#datepicker').datepicker('getDate');
        var end = $('#datepicker1').datepicker('getDate');
        var days   = (end - start)/1000/60/60/24;
        alert(days);
    });
});

HTML 部分

<form action="#" method="post" > 
                <dl>
                <dt><span> Leave Reason:</span>
                  <textarea name="reason" required></textarea>
                </dt>
                <br>
              <dd><span> Start Date:</span>
                </dd><br>
              <dd><input type="submit" value="Request" id="button" name="submit"></dd></dl></form>    <input type="text" id="datepicker" size="25" name ="date1"></dd>
              <br>              <dd><span> Expiry Date:</span>&nbsp;&nbsp;&nbsp; <input type="text" id="datepicker1" size="25" name ="date2"><br><br>

【问题讨论】:

  • 这里是图片的网址。因为我无法将图像附加到我的问题中。 oi60.tinypic.com/2a7tn4x.jpg
  • 嗨@AQEEL,欢迎来到 Stack Overflow。问答使用Markdown格式;添加图像的语法是![alt text](http://example.com/path/to/image.jpg)。我已编辑您的帖子以包含图片。
  • 你能提供你的html结构吗?至少是日期选择器占位符的主要部分?
  • 非常感谢。这是我在我的问题之外学到的新东西:)
  • @Nicolas 这里是 html 部分。我无法在 cmets 中编写代码,所以我将其上传为图片!code image

标签: javascript jquery html jquery-ui datepicker


【解决方案1】:

在您的示例中,当您使用日期选择器更改日期时,您已经在计算日期之间的工作日。这里我改进了这部分,仍然使用你从另一个 stackOverflow 问题中复制的 calcBusinessDays 方法:

$("#datepicker, #datepicker1").change(function() {
    //alert("getPricing just got called");
    var d1 = $("#datepicker").datepicker("getDate");
    var d2 = $("#datepicker1").datepicker("getDate");

    // Calculate only if both dates are defined
    if(d1 != undefined && d2 != undefined) {
        var days = calcBusinessDays(d1,d2);
        if(days > 0) {
            $("#leaves_left").val(days);
        } else {
            $("#leaves_left").val(0);
        }
    }
});

您可以将此方法的一部分外部化以在单击按钮时使用它:

var d1 = $("#datepicker").datepicker("getDate");
var d2 = $("#datepicker1").datepicker("getDate");

// Calculate only if both dates are defined
if(d1 != undefined && d2 != undefined) {
    var days = calcBusinessDays(d1,d2);
    alert(days);
}

顺便说一下,你也不应该使用dldddt标签来表示你正在尝试实现的东西。我不能给你一个与你的结构相对应的小提琴,只是一个基本的样本:http://jsfiddle.net/nrobert/6h85yvrg/

【讨论】:

  • 点击按钮时不弹出alert。
  • 正如我所说,我向您展示了如何计算。对于按钮单击,您必须更改实现方式:在提交按钮上使用click,而不是submit。示例:jsfiddle.net/nrobert/6h85yvrg/2
  • 我已经看到了样本,它工作正常。但是我看到当两个输入字段都不为空并且单击按钮时,不会显示任何警报。是吗?
  • 在最后一个版本中,我在每种情况下都收到了警报:如果两个输入都不为空,它会提醒天数,如果至少有 1 个缺失,它也会发出警报(说至少 1 个未定义)
猜你喜欢
  • 1970-01-01
  • 2010-12-09
  • 1970-01-01
  • 2023-01-31
  • 1970-01-01
  • 2015-02-26
  • 2019-09-27
相关资源
最近更新 更多