在 setInterval 中有一些代码只执行一次

Question

我的 Javascript 中有一个 setInterval 调用，用于检查是否有新的用户通知。此时间间隔进行 AJAX 调用并根据响应更新 DOM。此间隔设置为每 10 秒重复一次。

如果有新通知并且在此间隔内，则需要弹出一个小框。在当前代码中，如果有未标记为 seen 的新通知，则此框每 10 秒显示一次，这很烦人。

有没有办法让这个小框在每个通知集中只出现一次？因此，例如有 X 个新通知，并且 10 秒后这个数字没有改变，不要显示这个框。我如何实现这一目标？我被困在这里了。

这就是我的区间代码的样子：

setInterval(function(){
    $.get(generate_site_url() + 'user.php?action=get_notifications', function(data) {

        response = $.parseJSON(data);

        if ('error' in response)
        {
            return; 
        }

        if (response.notification_array.length == 0)
        {
            return; 
        }

        $('.user-notification').text(response.notification_count);
        $('.no-notes').hide();

        var notificationStr = '';

        for (var key in response.notification_array) 
        {
            var notification = response.notification_array[key];
            var notificationHTML = '<li' + ((notification.notification_seen == false) ? ' style="background: #fffaf1;"' : '') + '>';
            notificationHTML += '<a href="' + notification.notification_target + '" id="nid-' + notification.notification_id + '">';
            notificationHTML += '<span class="glyphicon glyphicon-' + ((notification.notification_type == 'like') ? 'thumbs-up' : (notification.notification_type == 'dislike') ? 'thumbs-down' : (notification.notification_type == 'favorite') ? 'heart' : 'bell') + '"></span>&nbsp;&nbsp;';
            notificationHTML += notification.notification_message;
            notificationHTML += '</a></li>';

            notificationStr += notification.notification_message + '<br />';

            $('.notifications-dropdown').prepend($(notificationHTML));
        }

        display_alert(notificationStr, 'danger', 5000, 'bottom'); // This shows the box
    });
}, 10000);

Answer 1

我将在这里扩展我原来的评论答案。

设置一个可在区间函数之外访问的变量，您可以在其中跟踪新通知的最后计数。下次间隔运行时，比较计数并检查是否有任何新计数。

var lastNewMessageCount = 0;
setInterval(function(){

  // ajax stuff
  if( response.notification_array.length > lastNewMessageCount ){
    // show notices

  }
  lastNewMessageCount = response.notification_array.length; 

});

Answer 2

尝试创建一个全局数组，然后在执行display_alert() 之前添加条件if(response.notification_array.length > nameOfGlobalArray.length)，如果条件返回true，则更新nameOfGlobalArray 以匹配response.notification_array，例如：

var notificationsArray = [];
setInterval(function(){
    $.get(generate_site_url() + 'user.php?action=get_notifications', function(data) {

        response = $.parseJSON(data);

        if ('error' in response)
        {
            return; 
        }

        if (response.notification_array.length == 0)
        {
            return; 
        }

        $('.user-notification').text(response.notification_count);
        $('.no-notes').hide();

        var notificationStr = '';

        for (var key in response.notification_array) 
        {
            var notification = response.notification_array[key];
            var notificationHTML = '<li' + ((notification.notification_seen == false) ? ' style="background: #fffaf1;"' : '') + '>';
            notificationHTML += '<a href="' + notification.notification_target + '" id="nid-' + notification.notification_id + '">';
            notificationHTML += '<span class="glyphicon glyphicon-' + ((notification.notification_type == 'like') ? 'thumbs-up' : (notification.notification_type == 'dislike') ? 'thumbs-down' : (notification.notification_type == 'favorite') ? 'heart' : 'bell') + '"></span>&nbsp;&nbsp;';
            notificationHTML += notification.notification_message;
            notificationHTML += '</a></li>';

            notificationStr += notification.notification_message + '<br />';

            $('.notifications-dropdown').prepend($(notificationHTML));
        }

        if(response.notification_array.length > notificationsArray.length)
        {
            display_alert(notificationStr, 'danger', 5000, 'bottom');
            notificationsArray = response.notification_array;
        }
    });
}, 10000);

[编辑] BotskoNet 的方法使用的数据较少，而且显然我的大脑没有打开：P 不过，两者都可以工作。

Answer 3

user.php 是否将通知标记为已发送？我假设不会，但如果是这样，您只需要检查是否有新通知进来，如果是，只需拨打display_alert()。

跟踪通知计数或比较字符串是不够的。有很多用例会导致误报。但我看到有一个notification_id 字段：

var delivered= [];
setInterval(function(){

  // ajax stuff
  for (var key in response.notification_array){
     var notification = response.notification_array[key];

     // check if the notification has been delivered
     if ($.inArray(notification.notification_id, delivered) === -1){ 
         // notification has not been delivered 
         delivered.push(notification.notification_id);

         // process notification as normal
     }
  }

  // only display the alert if there is something to display...
  if (notificationStr.length > 0) 
      display_alert(...);

}, 10000);