首页 > 代码库 > html5-Notification未来的属性

html5-Notification未来的属性

2024-10-20 11:31:39   207人阅读

用作桌面提醒特别方便，特别是手机端。先睹为快吧^_^

技术分享
 1 <!DOCTYPE html> 2 <html lang="en"> 3  4 <head> 5     <meta charset="UTF-8"> 6     <title>Document</title> 7 </head> 8  9 <body>10     <button>Notify me!</button>11     <script>12     window.addEventListener(‘load‘, function() {13         // At first, let‘s check if we have permission for notification14         // If not, let‘s ask for it15         if (window.Notification && Notification.permission !== "granted") {16             Notification.requestPermission(function(status) {17                 if (Notification.permission !== status) {18                     Notification.permission = status;19                 }20             });21         }22 23         var button = document.getElementsByTagName(‘button‘)[0];24 25         button.addEventListener(‘click‘, function() {26             // If the user agreed to get notified27             // Let‘s try to send ten notifications28             if (window.Notification && Notification.permission === "granted") {29                 for (var i = 0; i < 10; i++) {30                     // Thanks to the tag, we should only see the "Hi! 9" notification31                     var n = new Notification("Hi! " + i, {32                         tag: ‘soManyNotification‘33                     });34                 }35             }36 37             // If the user hasn‘t told if he wants to be notified or not38             // Note: because of Chrome, we are not sure the permission property39             // is set, therefore it‘s unsafe to check for the "default" value.40             else if (window.Notification && Notification.permission !== "denied") {41                 Notification.requestPermission(function(status) {42                     if (Notification.permission !== status) {43                         Notification.permission = status;44                     }45 46                     // If the user said okay47                     if (status === "granted") {48                         for (var i = 0; i < 10; i++) {49                             // Thanks to the tag, we should only see the "Hi! 9" notification50                             var n = new Notification("Hi! " + i, {51                                 tag: ‘soManyNotification‘52                             });53                         }54                     }55 56                     // Otherwise, we can fallback to a regular modal alert57                     else {58                         alert("Hi!");59                     }60                 });61             }62 63             // If the user refuses to get notified64             else {65                 // We can fallback to a regular modal alert66                 alert("Hi!");67             }68         });69     });70     </script>71 </body>72 73 </html>
View Code

 

html5-Notification未来的属性


联系
我们