HTML5实现浏览器的桌面通知 (兼容性多个浏览器)提示:需要在服务器上运行才会有效果,直接运行代码是没有效果的代码如下:
/*
* 桌面通知
* strNewsContent:通知的内容
*/
function windowsNotify(strNewsContent) {
if (!("Notification" in window) && !window.webkitNotifications && window.webkitNotifications.checkPermission() != 0)
return;
if (Notification.permission == null || Notification.permission == undefined)
windowsNotify360(strNewsContent);
else if (Notification.permission === "granted")
windowsNotifyFFAndGE(strNewsContent);
else if (Notification.permission !== 'denied') {
Notification.requestPermission(function (permission) {
if (!('permission' in Notification))
Notification.permission = permission;
if (permission === "granted")
windowsNotifyFFAndGE(strNewsContent);
});
}
}
//桌面通知(兼容360)
function windowsNotify360(strNewsContent) {
if (window.webkitNotifications && window.webkitNotifications.checkPermission() == 0) {
var notify = window.webkitNotifications.createNotification(
"http://www.fx678.com/corp/images/aboutus/htw.jpg",
'汇通-新闻中心',
strNewsContent
);
//设置定时撤销机制,防止通知长时间显示不被关闭
notify.ondisplay = function (event) {
setTimeout(function () {
event.currentTarget.cancel();
}, 10000);
};
//下面是定义点击事件,类似地还可定义其它事件
notify.onclick = function () {
window.focus();
this.cancel();
};
//弹出
notify.show();
} else if (window.webkitNotifications) {
window.webkitNotifications.requestPermission(windowsNotify360);
}
}
//桌面通知(兼容火狐、谷歌)
function windowsNotifyFFAndGE(strNewsContent) {
var notification = new Notification('汇通-新闻中心',
{
body: strNewsContent,
icon: "http://www.fx678.com/corp/images/aboutus/htw.jpg"
});
//设置定时撤销机制,防止通知长时间显示不被关闭
notification.ondisplay = function (event) {
setTimeout(function () {
event.currentTarget.cancel();
}, 10000);
};
//下面是定义点击事件,类似地还可定义其它事件
notification.onclick = function () {
window.focus();
this.cancel();
};
console.log(notification);
}
windowsNotify('asdsd');