如何在php中按周显示网格中的天数？

Posted 2023-02-23

【中文标题】如何在php中按周显示网格中的天数？

【英文标题】：How to display days in a grid by weeks in php?

【发布时间】：2019-06-22 02:18:17

【问题描述】：

我正在尝试以网格或表格形式显示一个月中的天数。我正在考虑使用 Bulma 或 bootstrap 来处理网格/表格。网格基于 5 行和 7 列。我不知道如何去实施一周中正确的日子。每周应按 div 分组，其中包含日期。这是我目前所拥有的：

  <?php

  $row = '';
  $startDate = 12/30/2018;
  $numDays = 35;
  $datesArr = array();
  $weekCounter = 1;

  for ($i = 0; $i <= numDays; i++) 
     $row .= '<div>';
     $date = date('m/j/Y', strtotime("$startDate +$i days"));
     $datesArr[] = $date;

     if ($i % 8 == 0) 
        $row .= '<p>Week ' . $weekCounter++ . '</p>';
      else 
        $row .= '<p>'.$date . ' - ' . date('l'), strtotime($date)). '</p>';
     

     $row .= '</div>';
  
  echo $row;
 ?>

这是我当前的输出：

第 1 周

2018 年 12 月 31 日-星期一

01/1/2019-星期二

2019 年 1 月 2 日-星期三

2019 年 1 月 3 日-星期四

2019 年 1 月 4 日-星期五

01/5/2019-星期六

2019 年 1 月 6 日-星期日

第 2 周

01/8/2019-星期二

2019 年 1 月 9 日-星期三

2019 年 1 月 10 日-星期四

2019 年 1 月 11 日-星期五

2019 年 1 月 12 日-星期六

2019 年 1 月 13 日-星期日

2019 年 1 月 14 日-星期一

第 3 周

2019 年 1 月 16 日-星期三

2019 年 1 月 17 日-星期四

2019 年 1 月 18 日-星期五

01/19/2019-星期六

2019 年 1 月 20 日-星期日

2019 年 1 月 21 日-星期一

01/22/2019-星期二

第 4 周

01/24/2019-星期四

2019 年 1 月 25 日-星期五

01/26/2019-星期六

2019 年 1 月 27 日-星期日

2019 年 1 月 28 日-星期一

01/29/2019-星期二

2019 年 1 月 30 日-星期三

第 5 周

2019 年 2 月 1 日-星期五

2019 年 2 月 2 日-星期六

2019 年 2 月 3 日-星期日

【问题讨论】：

欢迎来到 Stack Overflow。其中大部分将由 CSS 而不是 PHP 处理。我会建议一个表来构建视图。可能想看看 jQuery UI DatePicker，看看它是如何显示的。

【参考方案1】：

<?php

$row = '';
$startDate = '12/30/2018';
$numDays = 35;
$datesArr = array();
$weekCounter = 1;

for ($i = 0; $i <= $numDays; $i++) 

    $date = date('m/j/Y', strtotime("$startDate +$i days"));
    $datesArr[] = $date;

    // New div at start of week
    if (date("l", strtotime($date)) == "Sunday") 
        $row .= "<div style=\"float: left; margin: 10px;\">";
        $row .= '<p>Week ' . $weekCounter++ . '</p>';
    

    $row .= '<p>'. $date . ' - ' . date("l", strtotime($date)) . '</p>';

    // close div at end of week
    if (date("l", strtotime($date)) == "Saturday") 
        $row .= "</div>"; 
    



echo $row;

?>

【讨论】：

我认为我的实施不正确，我错过了第一周后一周的第一个星期一。

我刚刚将其添加到我的答案中

另外，我现在看到它只是一个包裹整个事物的大 div，而不是把它分成几个星期。寻找一种将每周包装在自己的 div 中的好方法。

谢谢。你会建议一种不同的方式来实现这一点，还是你认为我的第一种方法是有效的？由于我的个人时间限制，我几乎试图尽快解决它。

这应该是相当简单的，特别是如果你添加更多的条件，比如if (date("l", strtotime($date)) == "Monday")，然后在顶部添加一个 div，如果日期是星期日，则添加一个结束 div 标签。

【参考方案2】：

您也可以考虑使用 jQuery UI Datepicker。您可以使用 AJAX 获取开始日期和天数。然后绘制日历。

$(function() 
  function getDateInfo() 
    $.getJSON("dateInfo.php", function(data)
      drawCal(data.startDate, data.numDays, $(".calendar"));
    )
  

  function drawCal(sd, nd, tObj) 
    var format = "mm/dd/yy";
    var min = $.datepicker.parseDate(format, sd);
    var max = new Date();
    max.setDate(min.getDay() + nd);
    console.log(sd, max);
    tObj.html("");
    tObj.datepicker(
      dateFormat: format,
      minDate: min,
      maxDate: max,
      numberOfMonths: [3, 1]
    );
  

  drawCal("12/31/2018", 35, $(".calendar"));
);

.ui-datepicker-group 
  width: 100%;

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<div class="calendar"></div>