站長(zhǎng)資訊網(wǎng)Notifications是HTML5的一個(gè)新特性~ 可以看看360電腦搶票，也是用Notifications提示的~，下面小編寫了一個(gè)HTML5 Notifications桌面提醒，還是挺不錯(cuò)的哦！<!DOCTYPE html>
<html> <head> <meta charset="utf-8"> <title>HTML5 - Notifications</title> <script> //判斷瀏覽器是否支持Notifications function supported(){ if(window.webkitNotifications){ alert('瀏覽器支持Notifications'); } else { alert('瀏覽器不支持Notifications'); } } //請(qǐng)求桌面通知權(quán)限 function requestPermission() { window.webkitNotifications.requestPermission(); } //獲取請(qǐng)求權(quán)限狀態(tài) function checkPermission() { switch (window.webkitNotifications.checkPermission()) { case 0:alert('用戶已允許顯示桌面通知');break; case 1:alert('用戶還沒(méi)有允許或拒絕顯示桌面通知');break; case 2:alert('用戶已拒絕顯示桌面通知');break; } } //創(chuàng)建文本消息 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(); } //創(chuàng)建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="請(qǐng)求權(quán)限" onclick="requestPermission();"/> <input type="button" value="請(qǐng)求權(quán)限狀態(tài)" onclick="checkPermission();"/> <input type="button" value="顯示文本消息" onclick="textMsg();"/> <input type="button" value="顯示HTML消息" onclick="htmlMsg();"/> </body> </html>
