禁用公共假期，並在每個星期六在日歷上選擇特定時間范圍

Question

我是編碼新手並嘗試創建在線預訂約會，但我不知道如何在日歷上禁用選定的公共假期。 此外，如何使特定時間范圍依賴於日歷日？

例如，在每個星期六，時間范圍僅從上午 8:30 到下午 12:00 開始。 從早上 8:30 到下午 5:00 再過 5 天？ 如果你能幫助我，不勝感激。

我的編碼：

<div class="md-form mb-0">
   <label>Preferred Date</label>
     <input type=text id="PreferedDate" name="PreferedDate" class="form-control">
</div>

<script>
    $(document).ready(function() { 
        $(function() { 
            $("#PreferedDate").datepicker({ 
                dateFormat: 'dd-mm-yy', 
                minDate: 1,
                beforeShowDay: my_check 
            }); 
        }); 

        function my_check(in_date) { 
            if (in_date.getDay() == 0) { 
                return [false, "notav", 'Not Available']; 
            } else { 
                return [true, "av", "available"]; 
            } 
        } 
    }) 
</script>

<div class="md-form mb-0">
   <label>Preferred Time</label>
        <select class="form-control" name="PreferedTime" id="time">

        <script>
            //coding here?
        </script>

        <option value="8:00 AM">8:00 AM</option>
        <option value="8:15 AM">8:15 AM</option>
        <option value="8:30 AM">8:30 AM</option>
        <option value="8:45 AM">8:45 AM</option>

        <option value="9:00 AM">9:00 AM</option>
        <option value="9:15 AM">9:15 AM</option>
        <option value="9:30 AM">9:30 AM</option>
        <option value="9:45 AM">9:45 AM</option>

        <option value="10:00 AM">10:00 AM</option>
        <option value="10:15 AM">10:15 AM</option>
        <option value="10:30 AM">10:30 AM</option>
        <option value="10:45 AM">10:45 AM</option>

        <option value="11:00 AM">11:00 AM</option>
        <option value="11:15 AM">11:15 AM</option>
        <option value="11:30 AM">11:30 AM</option>
        <option value="11:45 AM">11:45 AM</option>

        <option value="12:00 PM">12:00 PM</option>
        <option value="12:15 PM">12:15 PM</option>
        <option value="12:30 PM">12:30 PM</option>
        <option value="12:45 PM">12:45 PM</option>

        <option value="1:00 PM">1:00 PM</option>
        <option value="1:15 PM">1:15 PM</option>
        <option value="1:30 PM">1:30 PM</option>
        <option value="1:45 PM">1:45 PM</option>

        <option value="2:00 PM">2:00 PM</option>
        <option value="2:15 PM">2:15 PM</option>
        <option value="2:30 PM">2:30 PM</option>
        <option value="2:45 PM">2:45 PM</option>

        <option value="3:00 PM">3:00 PM</option>
        <option value="3:15 PM">3:15 PM</option>
        <option value="3:30 PM">3:30 PM</option>
        <option value="3:45 PM">3:45 PM</option>

        <option value="4:00 PM">4:00 PM</option>
        <option value="4:15 PM">4:15 PM</option>
        <option value="4:30 PM">4:30 PM</option>
        <option value="4:45 PM">4:45 PM</option>

        <option value="5:00 PM">5:00 PM</option>
        <option value="5:15 PM">5:15 PM</option>
        <option value="5:30 PM">5:30 PM</option>            
      </select>                                 
   </div>

Answer 1

所以這段代碼是星期五的，如果你改變評論中顯示的 if 的值，你也可以解決你的問題，我希望它能幫助你！！！

 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <select id="abb"> <option value="8:00 AM">8:00 AM</option> <option value="8:15 AM">8:15 AM</option> <option value="8:30 AM">8:30 AM</option> <option value="8:45 AM">8:45 AM</option> <option value="9:00 AM">9:00 AM</option> <option value="9:15 AM">9:15 AM</option> <option value="9:30 AM">9:30 AM</option> <option value="9:45 AM">9:45 AM</option> <option value="10:00 AM">10:00 AM</option> <option value="10:15 AM">10:15 AM</option> <option value="10:30 AM">10:30 AM</option> <option value="10:45 AM">10:45 AM</option> <option value="11:00 AM">11:00 AM</option> <option value="11:15 AM">11:15 AM</option> <option value="11:30 AM">11:30 AM</option> <option value="11:45 AM">11:45 AM</option> <option value="12:00 PM">12:00 PM</option> <option value="12:15 PM">12:15 PM</option> <option value="12:30 PM">12:30 PM</option> <option value="12:45 PM">12:45 PM</option> <option value="1:00 PM">1:00 PM</option> <option value="1:15 PM">1:15 PM</option> <option value="1:30 PM">1:30 PM</option> <option value="1:45 PM">1:45 PM</option> <option value="2:00 PM">2:00 PM</option> <option value="2:15 PM">2:15 PM</option> <option value="2:30 PM">2:30 PM</option> <option value="2:45 PM">2:45 PM</option> <option value="3:00 PM">3:00 PM</option> <option value="3:15 PM">3:15 PM</option> <option value="3:30 PM">3:30 PM</option> <option value="3:45 PM">3:45 PM</option> <option value="4:00 PM">4:00 PM</option> <option value="4:15 PM">4:15 PM</option> <option value="4:30 PM">4:30 PM</option> <option value="4:45 PM">4:45 PM</option> <option value="5:00 PM">5:00 PM</option> <option value="5:15 PM">5:15 PM</option> <option value="5:30 PM">5:30 PM</option> </div> </select> <script> var d = new Date(); var n = d.getDay(); var abb = document.querySelector('#abb') console.log(n) if (n === 5) //5 is for friday, saturday =6 { for (let index = 0; index < abb.children.length; index++) { if (abb[index].value <= '12:00 PM' || abb[index].value >= '8:00 AM') abb[index].disabled = false else abb[index].disabled = true } } </script> </body> </html>

禁用公共假期，並在每個星期六在日歷上選擇特定時間范圍

問題描述

1 個解決方案

解決方案1
0 2020-03-20 09:33:10

禁用公共假期，並在每個星期六在日歷上選擇特定時間范圍

問題描述

1 個解決方案

解決方案1 0 2020-03-20 09:33:10

解決方案1
0 2020-03-20 09:33:10