html5 api通知,HTML5基础知识 - JavaScript API - Notifications - 简单通知

JavaScript

语言：

JaveScriptBabelCoffeeScript

确定

window.addEventListener('load', function() {

// At first, let's check if we have permission for notification

// If not, let's ask for it

if (window.Notification && Notification.permission !== "granted") {

Notification.requestPermission(function(status) {

if (Notification.permission !== status) {

Notification.permission = status;

}

});

}

var button = document.getElementsByTagName('button')[0];

button.addEventListener('click', function() {

var n = 1; //change this number and Notification tag parameter to see many notifications.

// If the user agreed to get notified

// Let's try to send ten notifications

if (window.Notification && Notification.permission === "granted") {

for (var i = 0; i < n; i++) {

// Thanks to the tag, we should only see the last notification

var n = new Notification("Hi Dude #" + i + ", any question on Techbrood?", {

body: 'Best viewed in Chrome, Do not use IE!',

icon: '/assets/check.png',

tag: 'soManyNotification',

});

}

}

// If the user hasn't told if he wants to be notified or not

// Note: because of Chrome, we are not sure the permission property

// is set, therefore it's unsafe to check for the "default" value.

else if (window.Notification && Notification.permission !== "denied") {

Notification.requestPermission(function(status) {

if (Notification.permission !== status) {

Notification.permission = status;

}

// If the user said okay

if (status === "granted") {

for (var i = 0; i < n; i++) {

// Thanks to the tag, we should only see the last notification

var n = new Notification("Hi Dude #" + i + ", any question on Techbrood?", {

body: 'Best viewed in Chrome, Do not use IE!',

icon: '/assets/check.png',

tag: 'soManyNotification',

});

}

}

// Otherwise, we can fallback to a regular modal alert

else {

alert("Hi!");

}

});

}

// If the user refuses to get notified

else {

// We can fallback to a regular modal alert

alert("Hi!");

}

});

});