主页 / 问题 / 1590770
Accepted
Aquila
Asked:2024-08-15 16:30:38 +0000 UTC2024-08-15 16:30:38 +0000 UTC

显示本周的指定日期，跳过过去的日期

  • 772

任务是这样的：我有一个按钮，其属性指示一周中的几天和患者预约的时间。当您单击按钮时，您需要显示一周中所有有时间的日子，但是！ 不显示过去的日子并显示未来的日子。那些。我已经在按钮中填写了所有日期+今天是星期四（08/15），这意味着我们跳过星期三、星期二和星期一，但显示星期日之后的其余日期。简而言之，就是始终显示 7 天，而不是过去的天。

整个故事的要点是，您可以在网站上提出申请，并选择日期和时间。

function getDayID(name)
    {
        if (name == 'monday') {
            return 1;
        } else if (name == 'tuesday') {
            return 2;
        } else if (name == 'wednesday') {
            return 3;
        } else if (name == 'thursday') {
            return 4;
        } else if (name == 'friday') {
            return 5;
        } else if (name == 'saturday') {
            return 6;
        } else if (name == 'sunday') {
            return 7;
        }
    }
        
    $(document).on('click', '.btn-about', function() {
     $('#timetable-list').text('');
        var time = $(this).attr('data-time');
            $.each(JSON.parse(time), function(key, val) {
                if (val != null) {
                    getDays(getDayID(key), val);
                }
            })    
    })
    
    function getDays(day = 1, time = '')
    {
        let start = moment();
        let end = moment().add(14 , 'd');
        
        var arr = [];
        let tmp = start.clone().day(day);
        if( tmp.isAfter(start, 'd') ){
            arr.push(tmp.format('DD.MM.YYYY'));
        }
        tmp.locale('ru');
        $('#timetable-list').append('<h2 data-time="'+time+'">'+tmp.format('DD.MM.YYYY')+'</h2><ul><li class="text-dark">'+time+'</li></ul>');
    }
<script src="https://momentjs.com/downloads/moment.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<button type="button" class="btn btn-med btn-standart btn-about" data-id="1" data-time='{"monday":"17:30, 12:10", "tuesday":"9:15", "wednesday":"9:15", "thursday":"11:00", "friday":"11:00", "saturday":"14:00", "sunday":"14:00"}'>О враче</button>

<div id="timetable-list"></div>

javascript

1 个回答

  1. Best Answer

    简而言之，这样总是显示 7 天，但不显示过去的天。

    我会建议这个选项...

    const inf = [
  'sunday',
  'monday',
  'tuesday',
  'wednesday',
  'thursday',
  'friday',
  'saturday',
]

$(document).on('click', '.btn-about', function() {
  $('#timetable-list').text('');
  let time = $(this).attr('data-time');
  time = JSON.parse(time)
  const n = 7
  const dt = new Date
  for (let i = 0; i < n; i++) {
    dt.setDate(dt.getDate() + 1)
    let v = dt.getDay()
    v = inf[v]
    v = time[v]
    write(dt, v)
  }
})

function write(day, time) {
  let d = day.toISOString().split('T')[0]
  d = d.replace(/(\d+)-(\d+)-(\d+)/, '$3.$2.$1')
  const s = `<h2 data-time="${time}">${d}</h2><ul><li class="text-dark">${time}</li></ul>`
  $('#timetable-list').append(s);
}
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<button type="button" class="btn btn-med btn-standart btn-about" data-id="1" data-time='{"monday":"17:30, 12:10", "tuesday":"9:15", "wednesday":"9:15", "thursday":"11:00", "friday":"11:00", "saturday":"14:00", "sunday":"14:00"}'>О враче</button>

<div id="timetable-list"></div>

    而如果data-time你写一个数组而不是一个对象，它会更短。 ;)

    • 1

相关问题