《notification》WEB开发桌面通知
2016-06-23 15:49
471 查看
<!DOCTYPE html>
<html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript"> var data = { "3179896": { "privateHost": "851307247", "nick": "不要用我的账号testimm2", "openTime": 1466567482, "aid": 3179896, "yy": 851307247 }, "5533480": { "privateHost": "155557733", "nick": "龙", "openTime": 1466567519, "aid": 5533480, "yy": 155557733 } } var HUYA_URL = 'http://www.huya.com/' //判断浏览器是否支持notification if(window.Notification){
//判断当前页面是否被允许发出通知 Notification.requestPermission(function() { for(var i in data){ var title = data[i].nick; var host = data[i].privateHost; var options = { body: title+ '要开播啦', tag: i, // 相当于ID,同一个的话,只能在同一个消息里更新 icon: 'http://huyaimg.dwstatic.com/avatar/1018/96/1a9129b7302bd1ddf08fad4cc5afee_180_135.jpg' }; var notice = new Notification(title, options); notice.onclick = function(){ var url = HUYA_URL + host window.open(url,'_blank'); notice.close(); } } }) } </script> </head> <body> </body> </html>
兼容性
Notification.permission 访问浏览器的状态 'granted' 为通过 '
default' 为默认
Notification.requestPermission(function(status) { //status是授权状态,如果用户允许显示桌面通知,则status为'granted' console.log('status: ' + status); //permission只读属性 var permission = Notification.permission; //default 用户没有接收或拒绝授权请求 不能显示通知 //granted 用户接受授权请求 允许显示通知 //denied 用户拒绝授权请求 不允许显示通知 console.log('permission: ' + permission); });
demo
https://www.audero.it/demo/web-notifications-api-demo.html
相关文章推荐
- JQuery1——基础($对象,选择器,对象转换)
- Android学习笔记(二九):嵌入浏览器
- Android java 与 javascript互访(相互调用)的方法例子
- android通知栏Notification点击,取消,清除响应事件
- Extjs4.0 最新最全视频教程
- Javascript中toFixed方法的改进
- JavaScript演示排序算法
- javascript实现10进制转为N进制数
- 5个常见可用性错误和解决方案
- 最后一次说说闭包
- Ajax
- js数组实现图片轮播
- 2019年开发人员应该学习的8个JavaScript框架
- HTML中的script标签研究
- 对一个分号引发的错误研究
- 异步流程控制:7 行代码学会 co 模块
- ES6 走马观花(ECMAScript2015 新特性)
- JavaScript拆分字符串时产生空字符的原因