javascript - 实现 jQuery 计时器

Question

我从数据库中获取笔记列表并将它们显示到视图中，如果笔记不到 15 分钟，那么我将显示一个编辑按钮，允许用户内联编辑笔记并保存新信息。我有这部分工作充分。我现在正在尝试在不到 15 分钟的笔记上附加一个计时器，并在计时器到时隐藏按钮。NB 用户可以编辑多个注释，只要它们小于 15 分钟。由于我对 jQuery 和 Javascript 不太熟悉，我该怎么做呢？感谢您的任何回复，因为我对这个论坛的东西很陌生，我不确定您是否需要代码来回答这个问题。所以如果有人想看，我会放上去的。

Answer 1

我会为仍然可编辑的笔记添加一个 .editable 类，并在不再可编辑时将其删除。您可以在 data-time="1359999066" 属性中保留注释的时间（假设它是 unix 时间戳）。如果您需要我暗示的代码的进一步帮助，请告诉我。

(function checkTimer() {
    $('.note.editable').each(function() {
        //check for timestamp, remove .editable and hide button
    });
    if ( $('.note.editable').length ) setTimeout(checkTimer, 5000);
})();
// this will check every 5 seconds

Answer 2

用法

    var timer = $.timer(function() {
            alert('This message was sent by a timer.');
    });

    timer.set({ time : 5000, autostart : true });

    timer.set(options);
    timer.play(reset);  // Boolean. Defaults to false.
    timer.pause();
    timer.stop();  // Pause and resets
    timer.toggle(reset);  // Boolean. Defaults to false.
    timer.once(time);  // Number. Defaults to 0.
    timer.isActive  // Returns true if timer is running
    timer.remaining // Remaining time when paused

http://code.google.com/p/jquery-timer/

它可能会解决您的问题..请参阅链接上的完整文章和演示

Answer 3

在服务器端，您可以将数据属性附加到包含创建时间的每个注释：

<div class="note" data-creation="1360000265027">
   <!-- milliseconds from 01.01.1970 (UTC) -->
   <p>My content</p>
   <button>edit</button>
</div>

现在您可以检查这是否超过 15 分钟：

(function checkTimer() {
     $('.note').each(function(){
         var creation = $(this).data('creation'),
              // time in milliseconds from 01.01.1970 (UTC) minus 15min (900000milsec)
              fifteenAgo = (new Date).getTime() - 9e5;
         if (creation <= fifteenAgo) {
              $(this).find('button').remove();
         }
    });
    if ( $('.note button').length ) setTimeout(checkTimer, 5000);
})();