HTML消息提醒（Notification）

深碍√TFBOYSˉ_ 2022-09-26 02:52 268阅读 0赞

function MessageNotice() {
        this.defaultTitle = document.title;
        this.message  = "【新消息】";
        this.emptyMsg = "【　　　】";
        //不少浏览器已经关闭了脚本化它们的状态栏的功能。
        this.noticeTimer = null;
        this.type = 0;
        this.data = null;
    }
    
    MessageNotice.prototype.startAnim = function (type, data) {
        this.type = type;
        this.data = data;
    
        this.stopAnim();
        var _message = this.message;
        var _emptyMsg = this.emptyMsg;
        var _defaultMsg = this.defaultTitle;
        this.noticeTimer = setInterval(function () {
            document.title = document.title == _message+_defaultMsg ? _emptyMsg+_defaultMsg : _message+_defaultMsg;
        }, 100);
    
        if (isNewQid && !isActiveBrowser && window.Notification || type == 1 && !isActiveBrowser && window.Notification) {
            if (Notification.permission == "granted") {
                this.pushNotice();
            } else if (Notification.permission != "denied") {
                Notification.requestPermission(function (permission) {
                    MessageNotice.prototype.pushNotice();
                });
            }
        }
    };
    
    MessageNotice.prototype.pushNotice = function() {
        var objType = this.type;
        var objData = this.data;
        if (Notification.permission == "granted") {
            var notification = new Notification("", {
                body : "您有新的消息",
                icon : ""
            });
            notification.onclick = function () {
                if (objType== 1) {
                    $("#userList>a>span[data-uid="+objData.toUserId+"]").parent().click();
                    $("#answerList>a[data-target-uid="+objData.toUserId+"][data-uid="+objData.targetUserId+"][data-qid="+objData.qid+"]").click();
                } else if (objType == 2) {
                    $("#show-problem").click();
                }
                //跳回浏览器
                window.focus();
                notification.close();
            }
        } else {
            console.log('浏览器不支持Notification');
        }
    };
    
    MessageNotice.prototype.stopAnim = function () {
        clearInterval(this.noticeTimer);
        document.title = this.defaultTitle;
    };

发表评论取消回复

表情：

评论列表（有 0 条评论，268人围观）

还没有评论，来说两句吧...

相关阅读

相关 jQuery Growl 插件(消息提醒)

jQuery Growl 插件(消息提醒) 允许您很容易地在一个覆盖层显示反馈消息。消息会在一段时间后自动消失，不需要单击"确定"按钮等。用户也可以通过移动鼠标或点击关闭按钮加

迷南。/ 2024年03月16日 14:08/ 0 赞/ 46 阅读

相关 android监听通知消息脚本,详解Android中Notification通知提醒

在消息通知时，我们经常用到两个组件Toast和Notification。特别是重要的和需要长时间显示的信息，用Notification就最合适不过了。当有消息通知时，状态栏会

清疚/ 2022年10月05日 08:57/ 0 赞/ 466 阅读

相关 HTML消息提醒（Notification）

function MessageNotice() { this.defaultTitle = document.title; this.

深碍√TFBOYSˉ_/ 2022年09月26日 02:52/ 0 赞/ 269 阅读

相关 Android Notification通知栏消息

Activity: package com.wkk.app8; import android.annotation.TargetApi; i

刺骨的言语ヽ痛彻心扉/ 2022年07月15日 01:46/ 0 赞/ 244 阅读

相关 H5桌面消息通知Notification

H5桌面消息通知Notification 代码很简单,直接复制即可看到效果 <!DOCTYPE html> <html> <head>

╰半夏微凉°/ 2022年04月03日 05:45/ 0 赞/ 336 阅读

相关 HTML5 之 notifications

<!DOCTYPE HTML> <html> <head <meta charset="gbk"> <title>HTML5 之 n

短命女/ 2022年03月17日 11:20/ 0 赞/ 180 阅读

相关 jQuery 标题消息闪烁提醒

示例图： ![20190516142109730.gif][] 源码： <!DOCTYPE html> <html lang="en"> <hea

骑猪看日落/ 2022年01月31日 10:29/ 0 赞/ 215 阅读

相关 JeeSite 4.x 消息管理、消息推送、消息提醒

[2019独角兽企业重金招聘Python工程师标准>>> ][2019_Python_] ![hot3.png][] 实现统一的消息推送接口，包含PC消息、短信消息、邮件消息

绝地灬酷狼/ 2022年01月14日 12:45/ 0 赞/ 449 阅读

相关 laravel 自带消息notification

1、简介除了支持发送邮件之外，`Laravel`还支持通过多种传输通道发送通知，这些通道包括邮件、短信（通过Nexmo）以及Slack等。通知可以存储在数据库以便后

旧城等待，/ 2021年10月01日 10:52/ 0 赞/ 548 阅读

相关 ant design vue中通知提醒框Notification的使用

效果：点击接口，出现提示弹框，数据获取到后在消失 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_tex

一时失言乱红尘/ 2021年07月24日 11:22/ 0 赞/ 4369 阅读