jQuery - 向注入(inject)的内容添加时间戳

Question

我有一些类似的东西:

默认情况下，所有这些面板都是空的。但用户操作可以填充面板，并且用户可以在面板之间切换。

我现在遇到的问题是，在面板之间切换会不断刷新服务器的内容，即使内容已经加载，这是一种缓慢的 UI 体验。

我正在考虑向每个面板 div 附加一个时间戳:

<div id="panel-1" timestamp="13123131313"></div>

然后使用该时间戳来确定是否应该重新访问服务器，如果不到一分钟则不要，如果超过一分钟则刷新内容。

我在寻找什么:

1. 您对此有何看法？
2. 在哪里可以安全地存储时间戳？
3. 进行时间戳比较的建议。有什么简单的 jQuery 解决方案吗？

感谢您帮助我思考这个问题。

Answer 1

您可以使用 jQuery 的 .data() 通过有效的标记轻松完成此任务。方法。

与此类似的东西:

// store timestamp on initial ajax load
var timestamp = new Date().getTime();
$('#panel-1').data('timestamp', timestamp);

// How to retrieve last timestamp
var last_stamp = $('#panel-1').data('timestamp');

// Example of comparing timestamps and setting a new one
var new_timestamp = new Date().getTime(),
    last_stamp = $('#panel-1').data('timestamp');
if (new_timestamp - last_stamp >= 60000) {
    $.ajax({
        /* ajax options */
        success: function() {
            var timestamp = new Date().getTime();
            $('#panel-1').data('timestamp', timestamp);
        }
    });
}