上週在公司做的一個Web聊天程式，需要一個即時訊息提醒並且帶有聲音提示的功能，在網上找了一下資料，Jquery有個一外掛 Jquery.Notify 這個運用比較

廣，官網有他的詳細介紹（https://notifyjs.com/）我這邊只是依據我的需求簡單的運用了一下；對了！他還有相應的Bootstrap封裝的版本，功能似乎更加強大

（http://bootstrap-notify.remabledesigns.com/），不多說了，先貼一下我的程式碼，有問題的地方還請提出：

$(function(){
	var receiveIcon；
	var receiveMessage；
	var audioElementHovertree;
	var showNotification =false;
//只在當前頁面失去焦點時提示訊息
    window.onblur = function () {
        showNotification = true;
    }
    window.onfocus = function () {
        showNotification = false;
    }});

//訊息提醒
function check() {
    // Let's check if the browser supports notifications
    if (!("Notification" in window)) {
        //alert("This browser does not support desktop notification");
        return false;
    }
    if (Notification.permission !== "granted") {
        Notification.requestPermission(function (permission) {
            // Whatever the user answers, we make sure we store the information
            if (!('permission' in Notification)) {
                Notification.permission = permission;
            }
        });
        return false;
    }
    return showNotification;
}

function notifyMe() {
    if (check()) {
        var notification = new Notification('新的訊息', {
            icon: receiveIcon,
            //body: "Hey there! You've been notified!",
            body:receiveMessage
        });

        notification.onshow = function () {
            $('audio').remove();
            audioElementHovertree = document.createElement('audio');
            audioElementHovertree.setAttribute('src', 'http://w.qq.com/audio/classic.mp3');
            audioElementHovertree.setAttribute('autoplay', 'autoplay'); //開啟自動播放
            //audioElement.load();
        }


        notification.onclick = function () {
            window.focus();
        };

        setTimeout(notification.close.bind(notification), 5000);//auto clear notifications
    }
}