從jquery UI日曆中選擇一個月的所有工作日

Question

我想從Jquery UI日曆中選擇一個月時獲取一個月的所有工作日。

下面是從date到date的選擇代碼，但是我需要的是，當我選擇一個月時，它應該打印整個月份的所有平日名稱。

eg: monday,tuesday,wednesday,thursday,friday,saturday,sunday 
    monday,tuesday,wednesday,thursday,friday,saturday,sunday 
    monday,tuesday,wednesday,thursday,friday,saturday,sunday 
    monday,tuesday,wednesday,thursday,friday,saturday,sunday 

從所選月份的開始日期日期到結束月份。

<input id="from" /> 
<input id="to" /> 
<button id="getBetween">Get Between Dates</button> 
<div id="results"></div> 

$("#from").datepicker(); 
$("#to").datepicker();  

$('#getBetween').on('click', function() { 
    var start = $("#from").datepicker("getDate"), 
     end = $("#to").datepicker("getDate"), 
     currentDate = new Date(start), 
     between = [] 
    ; 

    while (currentDate <= end) { 
     between.push(new Date(currentDate)); 
     currentDate.setDate(currentDate.getDate() + 1); 
    } 

    $('#results').html(between.join('<br> ')); 
}); 

Answer 1

下面的代碼片段將列出所選日期範圍內的所有日子。我已經刪除了代碼片段的日期選擇器引用。從你的問題中不清楚的是，日期名稱是否應該分解成幾個星期。

function getDayName(date) { 
 
    var dayNames = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday']; 
 
    
 
    return dayNames[date.getDay()]; 
 
} 
 

 

 
$('#getBetween').on('click', function() { 
 
    var start = new Date($("#from").val()), 
 
     end = new Date($("#to").val()), 
 
     between = []; 
 

 
    while (start <= end) { 
 
     between.push(getDayName(start)); 
 
     start.setDate(start.getDate() + 1); 
 
    } 
 

 
    $('#results').html(between.join('<br> ')); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
from start date date of a selected month to end month. 
 

 
<input id="from" value="2017-08-01"/> 
 
<input id="to" value="2017-08-31"/> 
 
<button id="getBetween">Get Between Dates</button> 
 
<div id="results"></div>

Answer 2

這裏可以對@Thuhs答案檢查意見後修改的答案。這裏工作jsfiddle。

這個想法是通過getDay()得到星期幾，並從具有星期名稱的數組中返回該值。小插件moonth-picker返回該月的第一天。函數new Date(selectedDate.getFullYear(), selectedDate.getMonth() + 1, 0, 23, 59, 59)稱呼最後一天。

$("#InlineMenu").MonthPicker({ 
 
    // SelectedMonth: '04/' + new Date().getFullYear(), 
 
    OnAfterChooseMonth: function(selectedDate) { 
 
    \t 
 
     \t var currentDate = selectedDate,  \t 
 
      lastDayOfMonth = new Date(selectedDate.getFullYear(), selectedDate.getMonth() + 1, 0, 23, 59, 59),   
 
      weekdays = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"], 
 
      between = []; 
 
\t \t \t \t 
 
     while (currentDate <= lastDayOfMonth) { 
 
      between.push(weekdays[new Date(currentDate).getDay()]); 
 
      currentDate.setDate(currentDate.getDate() + 1); 
 
     } 
 
     
 
     $('#results').html(between.join(', ')); 
 
     
 
    } 
 
});

<script type="text/javascript" src="//code.jquery.com/jquery-1.9.1.js"></script> 
 
<script type="text/javascript" src="//code.jquery.com/ui/1.9.2/jquery-ui.js"></script> 
 
<link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css"> 
 
<link rel="stylesheet" type="text/css" href="//rawgit.com/KidSysco/jquery-ui-month-picker/v3.0.0/demo/MonthPicker.min.css"> 
 
<script type="text/javascript" src="//rawgit.com/digitalBush/jquery.maskedinput/1.4.1/dist/jquery.maskedinput.min.js"></script> 
 
<script type="text/javascript" src="//rawgit.com/KidSysco/jquery-ui-month-picker/v3.0.0/demo/MonthPicker.min.js"></script> 
 

 
<div id='InlineMenu' style="float: left; margin-right: 20px;"></div> 
 
<div id="results" style="padding: 20px;"></div>