<html>
<head>
<title>桌面通知</title>
<meta name="description" content="实战Chrome浏览器桌面通知" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type='text/javascript'>
//granted 允许 denied 拒绝 undefined 未定义 default 用户不操作
function getStatus()
{
return Notification.permission;
}
function init() {
if (!("Notification" in window)){
alert("您当前浏览器不支持该功能!\n建议使用猎豹、360等浏览器使用此功能");
$("#zmtz").removeAttr("checked");
}
else {
//申请授权
if (Notification.permission == null || Notification.permission == undefined)
window.webkitNotifications.requestPermission();
else if (Notification.permission !== 'denied') {
Notification.requestPermission(function (permission) {
if (!('permission' in Notification))
Notification.permission = permission;
});
}
$("#zmtz").attr("checked","checked");
}
}
function send(title,theBody,theIcon)
{
var options = {
body: theBody,
icon: theIcon
}
if (!("Notification" in window)) {
return ;
}
else if (Notification.permission === "granted") {
// If it's okay let's create a notification
var notification = new Notification(title,options);
}
// Otherwise, we need to ask the user for permission
else if (Notification.permission !== 'denied') {
Notification.requestPermission(function (permission) {
// If the user accepts, let's create a notification
if (permission === "granted") {
var notification = new Notification(title,options);
}
});
}
}
</script>
</head>
<body>
<div>
<input type="button" value="开启" onclick="javascript:init()">
通知内容:<input type="button" value="发喊单" onclick="javascript:send('您有一条新喊单','详细信息','1.png')">
<input type="button" value="获取状态" onclick="javascript:alert(getStatus())">
</div>
</body>
</html>