0

我目前正在使用 jQuery Datepicker 来选择“to”和“from”范围来过滤 mysql 搜索结果。

我想要的是，如果我能以某种方式预读 mysql 数据库，那么当用户单击日期选择器时，弹出日历会显示（可能在括号中）每天在数据库中找到的项目数。例如

     Jan   2013
M  T  W  T  F  S  S 
--------------------
1  2  3  4  5  6  7
  (1)(5)(8)
--------------------
8  9  10 11 12 13 14
        (9)(3)
--------------------
15 16 17 18 19 20 21
(1)(1)(5)(6)
--------------------
22 23 24 25 26 27 28
--------------------
29 30 31
(8)
--------------------

为了解释更多，它是一个照片库应用程序。我希望能够选择一个日期范围来显示图片...但是如果用户不知道图片的日期并且只是“浏览”，那么在日历上会指示哪些日子有照片（由号）那会更好。

也许我可以这样做，内容示例中的日期：http: //keith-wood.name/datepick.html#daymods

起初我想象一个 jquery 函数，它查询数据库中的一组照片及其拍摄日期，总结起来。但是，如果那里有很多，那可能会很消耗......所以也许它可以即时完成，即当点击日期选择器并显示 1 个月时，它只查询了那个月的结果......但是然后如果月份更改，则必须即时再次查询....

我认为这最终可能超出了我的能力范围，但我们拭目以待。

提前致谢。

4

1 回答 1

0

一个简单的解决方案是获取所有日期的照片总数并将它们存储在一个对象中。即使有多年的数据，如果您只存储每天的计数，我不认为这会占用太多内存。

您可以使用 Ajax 请求获取数据：

$.ajax({
   dataType: "json",
   url: url,
   data: { date: date },
   success: success
});

url从您的 Web 服务器请求的 URL 是哪里，并且success是处理响应的回调。您将需要编写一些服务器端代码来处理请求并以您可以使用 JavaScript 轻松解释的格式（如 JSON）从 MySQL 返回数据。

获得数据后，您可以使用日期选择器的beforeShowDay选项在日历中的每个日期显示之前对其进行操作。例如，您可以添加一个工具提示，其中包含该日期的照片总数：

/* Assume data stored in var count */
$("#datepicker").datepicker(
    beforeShowDay: function(date) {
        return [ true, "", count[date] ];
    }
);

这是一个严重的过度简化（例如，您应该进行某种错误检查），但您明白了要点。这里有一个很好的例子。

如果您担心内存消耗，您可以仅预加载当前月份的计数，并在用户更改日期选择器中可见的月份或年份时发送 Ajax 请求以更新数据：

$("#datepicker").datepicker(
    onChangeMonthYear: function(year, month, inst) {
        /* Ajax request */
    }
);
于 2013-11-05T23:24:35.637 回答