JavaScript 兼容新旧版chrome和firefox的桌面通知

时间:2022-09-09 15:49:50

1.新/旧版本的chrome和firefox都可支持,IE下不支持因此设置为了在最小化窗口处闪烁显示提示文字。

2.设置为提示窗口显示5秒即关闭。

3.可设置图标和点击提示窗口要跳转到的页面(见输入参数)。

            var timer = null,
title = $('title').text(); $('body').on('click', function() {
clearInterval(timer);
$('title').text(title);
}); function showMsgNotification(title, msg , iconUrl ,clickUrl) {
var Notification = window.Notification || window.mozNotification || window.webkitNotification;
if (window.webkitNotifications) {
//chrome老版本
if (window.webkitNotifications.checkPermission() == 0) {
var notif = window.webkitNotifications.createNotification(iconUrl, title, msg);
notif.display = function() {
setTimeout(function() {
notif.close();
}, 5000);
}
notif.onerror = function() { }
notif.onclose = function() { }
notif.onclick = function() {
window.focus();
window.location.href = clickUrl;
}
notif.replaceId = 'Meteoric';
notif.show();
} else {
window.webkitNotifications.requestPermission($jy.notify);
}
}
else if(Notification) {//支持桌面通知
if(Notification.permission == "granted") {//已经允许通知
var instance = new Notification(title, {
body: msg,
icon: iconUrl
//renotify : true
}); instance.onclick = function() {
//$('body').css({'background': 'red'});
//console.log('onclick');
window.focus();
window.location.href = clickUrl;
//window.open(clickUrl, "_blank");
};
instance.onerror = function() {
//console.log('onerror');
};
instance.onshow = function() {
setTimeout(function() {
instance.close();
}, 5000);
};
instance.onclose = function() {
//console.log('onclose');
};
}else {//第一次询问或已经禁止通知(如果用户之前已经禁止显示通知,那么浏览器不会再次询问用户的意见,Notification.requestPermission()方法无效)
Notification.requestPermission(function(status) {
if (status === "granted") {//用户允许
var instance = new Notification(title, {
body: msg,
icon: iconUrl
}); instance.onclick = function() {
window.focus();
window.location.href = clickUrl;
};
instance.onerror = function() {
// Something to do
};
instance.onshow = function() {
// Something to do
};
instance.onclose = function() {
// Something to do
};
}else {//用户禁止
return false;
}
});
}
}else {//不支持(IE等)
var index = 0; clearInterval(timer);
timer = setInterval(function() {
if(index%2) {
$('title').text('【   】'+ title);//这里是中文全角空格,其他不行
}else {
$('title').text('【快讯】'+ title);
}
index++; if(index > 20) {
clearInterval(timer);
}
}, 500);
}
}