用作桌面提醒特别方便，特别是手机端。先睹为快吧^_^
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 notification
14 // If not, let‘s ask for it
15 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 notified
27 // Let‘s try to send ten notifications
28 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" notification
31 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 not
38 // Note: because of Chrome, we are not sure the permission property
39 // 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 okay
47 if (status === "granted") {
48 for (var i = 0; i < 10; i++) {
49 // Thanks to the tag, we should only see the "Hi! 9" notification
50 var n = new Notification("Hi! " + i, {
51 tag: ‘soManyNotification‘
52 });
53 }
54 }
55
56 // Otherwise, we can fallback to a regular modal alert
57 else {
58 alert("Hi!");
59 }
60 });
61 }
62
63 // If the user refuses to get notified
64 else {
65 // We can fallback to a regular modal alert
66 alert("Hi!");
67 }
68 });
69 });
70 </script>
71 </body>
72
73 </html>
时间： 2024-10-16 10:43:31