Noty.js 在新通知上删除最旧的通知答案

【问题标题】：Noty.js removing oldest notification on new notificationNoty.js 在新通知上删除最旧的通知
【发布时间】：2014-03-12 09:03:02
【问题描述】：

我正在使用这个脚本http://ned.im/noty/ 用于显示通知

    var n = noty({
        text: message,
        type: type,
        dismissQueue: true,
        force: true,
        layout : "bottomLeft",
        theme: 'newTheme',
        maxVisible : 5
    });

所以这是当前配置，它有 5 个项目排队。问题是，当单击按钮时，我无法弄清楚如何删除显示新通知的第一个通知。欢迎任何想法。

【问题讨论】：

标签： javascript jquery notifications jgrowl noty

【解决方案1】：

好的，我使用 noty.js API 解决了这个问题：http://ned.im/noty/#api

首先我定义了顶部通知

var notyclose_id    = $("#noty_bottomLeft_layout_container>li:first-child>.noty_bar").attr('id');

之后我会收到通知数量

var noty_list_count = $("#noty_bottomLeft_layout_container li").size();

我检查此金额是否大于或等于我的通知设置

    if(noty_list_count >= 5) 
        $.noty.close(notyclose_id);

如果是，我使用 api 将其关闭。 :)

【讨论】：

【解决方案2】：

一直在寻找这个并最终来到这里；当前版本（3.1.0）允许你使用 killer 选项：

noty({
    text: 'I have just killed it',
    type: 'success',
    killer : true
})

看起来它“杀死”了队列中所有以前的通知，使“这个”成为唯一显示的通知。

【讨论】：

如Noty Options 所见，killer 是一个布尔值/字符串（true 或 false）选项，“如果为 true，则关闭所有可见通知并显示自身。”

【解决方案3】：

您还可以考虑自动删除超时。这就是我对信息和成功消息所做的事情：它们会在 3 秒后自动消失 (timeout: 3000)。我将错误和警告消息永久保留（用户必须单击它才能删除，timeout: false，这是默认设置）。

这样，事情就不太可能堆积起来，并且需要更少的用户交互。减少摩擦。我不知道它是否适合您的用例。

noty({
    text: 'Sucessfully persisted xy value',
    layout: 'bottomRight',
    type: 'success',
    timeout: 3000,
    animation: {
        open: 'animated zoomInUp', // Animate.css class names
        close: 'animated zoomOutUp' // Animate.css class names
    }
});


noty({
    text: 'Error while writing value xy',
    layout: 'bottomRight',
    type: 'error',
    animation: {
        open: 'animated zoomInUp', // Animate.css class names
        close: 'animated zoomOutUp' // Animate.css class names
    }
});

【讨论】：

【解决方案4】：

如果您将布局用作“topRight”，那么下面给出的代码很有帮助。

var notyclose_id    = $("#noty_topRight_layout_container>li:first- child>.noty_bar").attr('id');
var noty_list_count = $("#noty_topRight_layout_container li").size();
if(noty_list_count >= 6) {
$.noty.close(notyclose_id);
}

您还需要调用 $.notyRenderer.show() 来显示一条新消息，它已经存在但您需要每次都调用它

if(instance.options.maxVisible > 0) {
//if($(instance.options.layout.container.selector + ' > li').length < instance.options.maxVisible) {
$.notyRenderer.show($.noty.queue.shift());
//}
//else {
//}
}

【讨论】：