360极速浏览器如何及时获取通知

发布网友 发布时间：2022-04-30 17:07

我来回答

共2个回答

懂视网 时间：2022-04-24 04:01

桌面提醒：

这个H5有个强大的API没错就是Notification, 没听过？ 先去了解下，很详细;浏览器不同对其支持程度也不同，简单讲就是有兼容问题，而笔者要说的就是基于Notification的一款小类库 ,其支持：IE9+、Safari6、Firefox、Chrome；好吧都是前辈的结晶，我就是个搬砖的，下面附一个简单的小demo:

ps: 么有用类库, 就是练手用的..实际还是用类库吧；

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);
 }
}

任务栏提醒：

这个还真是个问题; 至于解决的终极方法目前笔者还没研究明白;不过window.open 这种弹窗会触发闪烁提醒, 但需要解决用户禁止弹窗的情况,可以模拟from提交 || 超链接(a) || 利用浏览器冒泡;这几种方法都可以解决大部分被拦截的情况; 可这都不是笔者想要的;因为提示内容展示在弹窗中总是不好的,用户很容易蒙圈，怎么一有提示就多个标题栏呢...很烦,貌似内存溢出也可以，不过这个就算了，除非脑子进水了...; 期待大神指点..；

热心网友 时间：2022-04-24 01:09