怎麼讓用戶收到瀏覽器的訊息提醒？

如何讓使用者在瀏覽器最小化的狀態下也能及時的收到訊息提醒呢？ 這個問題作為webRd是要正面面對的. 大約可分兩種場景：一種是類似桌面通知的形式還有一種是類似QQ提醒(在系統任務欄閃爍隨後高亮);接下來分別研究下：

桌面提醒：

這個H5有個強大的API沒錯就是Notification, 沒聽過？先去了解下，很詳細;瀏覽器不同對其支援程度也不同，簡單講就是有相容問題，而筆者要說的就是基於Notification的一款小類庫 ,其支援：IE9+、Safari6、Firefox、Chrome ；好吧都是前輩的結晶，我就是個搬磚的，下面附一個簡單的小demo:

ps: 麼有用類庫, 就是練手用的..實際還是用類庫吧；

<br>

function _Notification(title,option){
    var Notification = window.Notification || window.mozNotification || window.webkitNotification;
    Notification.permission === "granted"?creatNotification(title, option):requestPermission(title, option);
    function creatNotification(title, option){
       var instance = new Notification(title, option);
        instance.onclick = function () {
            console.log('onclick');
        };
        instance.onerror = function () {
            console.log('onerror');
        };
        instance.onshow = function () {
            console.log('onshow');
        };
        instance.onclose = function () {
            console.log("close")
        }
    }
    function requestPermission(title, option){
        Notification.requestPermission(function(status) {
            status === "granted"?creatNotification(title, option):failNotification(title);
        });
    }
    function failNotification(title){
        var timer;
        return function(timer){
            var index = 0;
            clearInterval(timer);
            timer = setInterval(function() {
                if(index%2) {
                    document.head.getElementsByTagName("title")[0].innerHTML = '【　　　】'+ title;
                }else {
                    document.head.getElementsByTagName("title")[0].innerHTML = '【新消息】'+ title;
                }
                index++;
                if(index > 20) {
                    clearInterval(timer);
                }
            }, 500);
        }(timer);
    }
}

 <br>

任務欄提醒：

這個還真是個問題; 至於解決的終極方法目前筆者還沒研究明白;不過window.open 這種彈窗會觸發閃爍提醒, 但需要解決使用者禁止彈窗的情況,可以模擬from提交|| 超連結(a) || 利用瀏覽器冒泡;這幾種方法都可以解決大部分被攔截的情況; 可這都不是筆者想要的;因為提示內容展示在彈窗中總是不好的,用戶很容易蒙圈，怎麼一有提示就多個標題欄呢...很煩,貌似內存溢出也可以，不過這個就算了，除非腦進水了...; 期待大神指點..;

以上是怎麼讓用戶收到瀏覽器的訊息提醒？的詳細內容。更多資訊請關注PHP中文網其他相關文章！