HTML5實現(xiàn)桌面通知 提示功能
發(fā)布時間:2017-10-11 15:52:46 作者:佚名
我要評論
這篇文章主要介紹了HTML5實現(xiàn)桌面通知 提示功能,非常不錯,具有參考借鑒價值,需要的朋友參考下吧
具體代碼如下所示:
<button id="button">有人想加你為好友</button>
<p id="text"></p>
;(function (){
if(window.Notification){
var btn = document.getElementById("button");
var txt = document.getElementById("text");
btn.onclick = function (){
if(Notification.permission == "granted"){
popNotice();
}else if(Notification.permission != "denied"){
Notification.requestPermission().then(function (permission){
popNotice()
})
}
};
function popNotice(){
if(Notification.permission == "granted"){
var notification = new Notification("你好:",{
body:"請問今晚有空嗎",
icon:"http://image.zhangxinxu.com/左邊頭像地址"
});
notification.onclick = function (){
txt.innerHTML = new Date().toTimeString().split(" ")[0]+"收到信息";
notification.close();
}
}
}
}else{
console.log("瀏覽器不支持Notification");
}
})();
Notification.requestPermission()是個請求 ,讓瀏覽器出現(xiàn)是否允許通知的提示 和 Notification.permission 一樣 返回 "3"個值 "granted" "default" "denied" 戶允許通知, 用戶目前還沒有管, 用戶嫌棄
總結(jié)
以上所述是小編給大家介紹的HTML5實現(xiàn)桌面通知 提示功能,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關(guān)文章

Html5中的桌面通知Notification的實現(xiàn)
這篇文章主要介紹了Html5中的桌面通知Notification的實現(xiàn)的相關(guān)資料,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2018-09-25HTML5實現(xiàn)Notification API桌面通知功能
Notification生成的消息不依附于某個頁面,僅僅依附于瀏覽器。 下面通過本文給大家介紹HTML5實現(xiàn)Notification API桌面通知功能,需要的朋友參考下吧2016-03-02html5桌面通知(Web Notifications)實例解析
這篇文章主要為大家介紹了html5桌面通知(Web Notifications)實例,對于進行html5網(wǎng)站建設(shè)非常有用!需要的朋友可以參考下2014-07-07突襲HTML5之Javascript API擴展5—其他擴展(應(yīng)用緩存/服務(wù)端消息/桌面
前面已經(jīng)總結(jié)了主要的API擴展(應(yīng)用緩存/服務(wù)端消息/桌面通知),下面的幾個只有在特定的場合才能發(fā)揮它的潛質(zhì),無一例外,IE均不支持,桌面通知目前只有Chrome支持,感興趣的朋2013-01-31
HTML5中的Web Notification桌面通知功能的實現(xiàn)方法
這篇文章主要介紹了HTML5中的Web Notification桌面通知功能的實現(xiàn)方法,需要的朋友可以參考下2019-07-29



