jquery - 通过 CSS 制作 HTML 月日日期今天星期

Question

我正在处理内部分析报告页面，需要时间生成的记录。我的灵感来自 Google Analytics 的工作方式。

第一件事是每小时、每天、每周、每月，第二件事是在日期之间显示它。

我希望以下拉格式显示这些选项。对于 Hourly、Day、Week 和 Month，这似乎很简单，但在下拉列表中显示两个日期选择器似乎很难。我该怎么做？

举个例子，这是它在 Google Analytics 中的显示方式。

这是我尝试过的:-

<?php
    $todo=$_POST['todo'];
    if(isset($todo) and $todo=="submit"){
    $month=$_POST['month'];
    $dt=$_POST['dt'];
    $year=$_POST['year'];
    $date_value="$month/$dt/$year";
    echo "mm/dd/yyyy format :$date_value<br>";
    $date_value="$year-$month-$dt";
    echo "YYYY-mm-dd format :$date_value<br>";
    }

 ?>
    <form method=post name=f1 action=''><input type=hidden name=todo value=submit>
    <table border="0" cellspacing="0" >
    <tr><td  align=left  >   
    <select name=month value=''>Select Month</option>
    <option value='01'>January</option>
    <option value='02'>February</option>
    <option value='03'>March</option>
    <option value='04'>April</option>
    <option value='05'>May</option>
    <option value='06'>June</option>
    <option value='07'>July</option>
    <option value='08'>August</option>
    <option value='09'>September</option>
    <option value='10'>October</option>
    <option value='11'>November</option>
    <option value='12'>December</option>
    </select>

    </td><td  align=left  >   
    Date<select name=dt >
    <option value='01'>01</option>


    <option value='02'>02</option>
    <option value='03'>03</option>
    <option value='04'>04</option>
    <option value='05'>05</option>
    <option value='06'>06</option>
    <option value='07'>07</option>
    <option value='08'>08</option>
    <option value='09'>09</option>
    <option value='10'>10</option>
    <option value='11'>11</option>
    <option value='12'>12</option>
    <option value='13'>13</option>
    <option value='14'>14</option>
    <option value='15'>15</option>
    <option value='16'>16</option>
    <option value='17'>17</option>
    <option value='18'>18</option>
    <option value='19'>19</option>
    <option value='20'>20</option>
    <option value='21'>21</option>
    <option value='22'>22</option>
    <option value='23'>23</option>
    <option value='24'>24</option>
    <option value='25'>25</option>
    <option value='26'>26</option>
    <option value='27'>27</option>
    <option value='28'>28</option>
    <option value='29'>29</option>
    <option value='30'>30</option>
    <option value='31'>31</option>
    </select>


    </td><td  align=left  >   
    Year(yyyy)<input type=text name=year size=4 value=2005>
    <input type=submit value=Submit>
    </table>


    </form>

谢谢。

Answer 1

您可以通过使用和自定义 Datepicker 来实现类似的效果来自 jQuery UI 的小部件，以及 Timepicker插件，可用于选择时间。

Here's an example如何使用 DatePicker 显示多个月份。 Timepicker 主页有 several examples如何自定义它以满足您的需求。