溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要為大家展示了“HTML5中Notifications桌面提醒怎么用”，內容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領大家一起研究并學習一下“HTML5中Notifications桌面提醒怎么用”這篇文章吧。
undefinedundefinedundefined
示例
<html>
<head>
<meta charset="utf-8">
<title>HTML5 - Notifications</title>
<script>
//判斷瀏覽器是否支持Notifications
function supported(){
if(window.webkitNotifications){
alert('瀏覽器支持Notifications');
} else {
alert('瀏覽器不支持Notifications');
}
}
//請求桌面通知權限
function requestPermission() {
window.webkitNotifications.requestPermission();
}
//獲取請求權限狀態
function checkPermission() {
switch (window.webkitNotifications.checkPermission()) {
case 0:alert('用戶已允許顯示桌面通知');break;
case 1:alert('用戶還沒有允許或拒絕顯示桌面通知');break;
case 2:alert('用戶已拒絕顯示桌面通知');break;
}
}
//創建文本消息
function textMsg(){
var icon = 'logo.png';
var title = '阿鵬\'s BLOG';
var body = 'http://www.1990c.com';
var popup = window.webkitNotifications.createNotification(icon, title, body);
popup.ondisplay = function(event) {
setTimeout(function() {
event.currentTarget.cancel();
}, 5000);
}
popup.show();
}
//創建HTML消息
function htmlMsg(){
var popup = window.webkitNotifications.createHTMLNotification('msg.html');
popup.ondisplay = function(event) {
setTimeout(function() {
event.currentTarget.cancel();
}, 5000);
}
popup.show();
}
</script>
</head>
<body>
<input type="button" value="是否支持桌面提醒" onclick="supported();"/>
<input type="button" value="請求權限" onclick="requestPermission();"/>
<input type="button" value="請求權限狀態" onclick="checkPermission();"/>
<input type="button" value="顯示文本消息" onclick="textMsg();"/>
<input type="button" value="顯示HTML消息" onclick="htmlMsg();"/>
</body>
</html>以上是“HTML5中Notifications桌面提醒怎么用”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
