javascript - Datepicker - 计算不包括节假日和周末的天数

标签 javascript jquery jquery-ui datepicker

我已经尝试了几种方法来让它工作,但由于我对 javascript 缺乏了解,没有成功。

我只是希望这个小脚本能够完全按照当前的方式工作,但我希望计算出的天数不包含周末或假期。有什么帮助吗?

JavaScript:

    $(function() {
  $('#from').datepicker({
  showOnFocus: false,
  showTrigger: '#calImg',
  beforeShowDay: $.datepicker.noWeekends,
  pickerClass: 'noPrevNext',
    numberOfMonths: 1,
        dateFormat: 'mm-dd-yy',
        minDate: '0',
        maxDate: '+1Y',
              onSelect: function(dateStr) {
                    var min = $(this).datepicker('getDate');
                    $('#to').datepicker('option', 'minDate', min || '0');
                    datepicked();
        }});
  $('#to').datepicker({
  showOnFocus: false,
  showTrigger: '#calImg',
  beforeShowDay: $.datepicker.noWeekends,
  pickerClass: 'noPrevNext',
    numberOfMonths: 1,
        dateFormat: 'mm-dd-yy',
        minDate: '0',
        maxDate: '+1Y',
              onSelect: function(dateStr) {
                    var max = $(this).datepicker('getDate');
                    $('#from').datepicker('option', 'maxDate', max || '+1Y');
                    datepicked();                                               
       }});
});

var datepicked = function() {
var from = $('#from');
var to = $('#to');
var nights = $('#nights');

 var fromDate = from.datepicker('getDate')

    var toDate = to.datepicker('getDate')

    if (toDate && fromDate) {
    var difference = 0;
        var oneDay = 1000*60*60*24;
        var difference = Math.ceil((toDate.getTime() - fromDate.getTime() + 1) / oneDay);
        nights.val(difference);

      }
}

HTML:

      <table width="100%" border="0" cellpadding="2">
      <tr>
      <td nowrap>Vacation Request From</td>
      <td><input type="text" id="from" name="from" size="28" style="width:194px; /*Tag Style*/" value="" ><div style="display: none;"> 
<img id="calImg" src="http://www.mywebsite.com/images/calendar-green.gif" alt="Popup" class="trigger"></div> To <input type="text" id="to" name="to" size="28" style="width:194px; /*Tag Style*/" value="" ><div style="display: none;">
<img id="calImg" src="http://www.mywebsite.com/images/calendar-green.gif" alt="Popup" class="trigger"> 

</div></td>
      <td width="1">&nbsp;</td>

     </tr>
     <tr>
      <td >Total Days Requested: </td>
      <td colspan="5"><input type="text" id="nights" name="nights" style="width:50px; /*Tag Style*/" value="" readonly="readonly"></td>
     </tr>

     <tr>
      <td colspan="6">&nbsp;</td>
     </tr>
   </table>

最佳答案

成功! This page很有帮助。因此,HTML 与上面相同以及更新的 jquery/javascript,我就开始工作了。

    $(function() {
  $('#from').datepicker({
  showOnFocus: false,
  showTrigger: '#calImg',
  beforeShowDay: $.datepicker.noWeekends,
  pickerClass: 'noPrevNext',
    numberOfMonths: 1,
        dateFormat: 'mm-dd-yy',
        minDate: '0',
        maxDate: '+1Y',
              onSelect: function(dateStr) {
                    var min = $(this).datepicker('getDate');
                    $('#to').datepicker('option', 'minDate', min || '0');
                    datepicked();
        }});
  $('#to').datepicker({
  showOnFocus: false,
  showTrigger: '#calImg',
  beforeShowDay: $.datepicker.noWeekends,
  pickerClass: 'noPrevNext',
    numberOfMonths: 1,
        dateFormat: 'mm-dd-yy',
        minDate: '0',
        maxDate: '+1Y',
              onSelect: function(dateStr) {
                    var max = $(this).datepicker('getDate');
                    $('#from').datepicker('option', 'maxDate', max || '+1Y');
                    datepicked();                                               
        }});
    });


    var datepicked = function() {
    var from = $('#from');
    var to = $('#to');
    var nights = $('#nights');

 var startDate = from.datepicker('getDate')

var endDate = to.datepicker('getDate')


// Validate input
if (endDate && startDate) {


// Calculate days between dates
var millisecondsPerDay = 86400 * 1000; // Day in milliseconds
startDate.setHours(0,0,0,1);  // Start just after midnight
endDate.setHours(23,59,59,999);  // End just before midnight
var diff = endDate - startDate;  // Milliseconds between datetime objects    
var days = Math.ceil(diff / millisecondsPerDay);

// Subtract two weekend days for every week in between
var weeks = Math.floor(days / 7);
var days = days - (weeks * 2);

// Handle special cases
var startDay = startDate.getDay();
var endDay = endDate.getDay();

// Remove weekend not previously removed.   
if (startDay - endDay > 1)         
    var days = days - 2;      

// Remove start day if span starts on Sunday but ends before Saturday
if (startDay == 0 && endDay != 6)
    var days = days - 1  

// Remove end day if span ends on Saturday but starts after Sunday
if (endDay == 6 && startDay != 0)
   var days = days - 1  

nights.val(days);
    }
    }

关于javascript - Datepicker - 计算不包括节假日和周末的天数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16553170/

相关文章:

css - Jquery 选项卡不显示

javascript - async/await 总是返回未定义

javascript - 无法从输入类型数值中删除逗号

javascript - web worker如何在单核机器上工作

javascript - 仅当数据来自循环 GET 请求时,JSON stringify 才会失败

javascript - 使用 jquery 或 javascript 按钮单击计时器 5 秒

javascript - jQuery UI 日期选择器 mm/dd/y 格式年份 1915 转换为 2015

单击按钮时的 jquery 对话框

javascript - 我在哪里可以将文件名存储在 html 的 li 标签中?

javascript - 克拉姆当延伸