html5桌面提醒功能

2022-08-15 07:00:17 字數 1265 閱讀 9753

html5中的桌面提醒(web notifications)能夠讓使用者在作業系統桌面得到實時的訊息提醒,在網頁多視窗聊天的時候,這一功能將極大的方便使用者。但是實現這一功能的瀏覽器均以webkit為核心。應用的範圍還很有限

1. api介紹

①桌面提醒功能是由window物件下的webkitnotifications來實現的,通過window.webkitnotifications將返回乙個notificationcenter物件。這個物件沒有屬性,但是卻關聯著四個方法:

a.requestpermission()

b.checkpermission()

c.createnotification()

d.createhtmlnotification()

1、requestpermission()

①這個方法用於向使用者請求獲得訊息提醒的許可權,呼叫這個方法分別對應著3中狀態:「granted」(狀態值:0)表示使用者同意訊息提醒;「default」(狀態值:1)表示預設狀態,使用者既未拒絕,也未同意;「denied」(狀態值:1)表示使用者拒絕訊息提醒。只有在狀態值為0的時候才能夠允許訊息提醒,這個值儲存在乙個內部變數中,並且是唯讀的,通過checkpermission()方法可以提取到這個狀態值。

2、checkpermission()

這個方法用於獲取請求許可權的狀態值,並返回這個值。

3、createnotification()

① 這個方法以純訊息的方式建立提醒訊息,它接受三個引數:iconurl, title, body。這三個引數均為字串格式,iconurl表示乙個圖示位址、title表示訊息標題、body表示訊息主體,預設這三個引數為空字串

② 呼叫這個方法會返回乙個notification物件,我們可以針對這個物件做更多的設定。

b.   onshow:事件屬性,當訊息框顯示的時候觸發該事件;

c.   onclick:事件屬性,當點選訊息框的時候觸發該事件;

d.   onclose:事件屬性,當訊息關閉的時候觸發該事件;

e.   onerror:事件屬性,當出現錯誤的時候觸發該事件;(todo:錯誤型別)

f. 方法:

a.  addeventlistener && removeeventlistener:常規的新增和移除事件方法;

HTML 5 桌面提醒

notification.requestpermission 該方法將向使用者請求詢問顯示提示框的許可權。返回值有三個 default 預設 granted 允許 denied 拒絕 var notify new notification title,options 建構函式,兩個引數為title ...

html5 桌面提醒 Notifycations

html5中的桌面提醒 web notifications 可以在當前頁面視窗彈出乙個訊息框,這個訊息框是跨 tab 視窗的 本地化的,可以疊加在其他程式介面上,不侷限與瀏覽器視窗內,觸發時及時瀏覽器最小化或者不在螢幕最前面也能顯示訊息窗,這在使用者開啟多個 tab 瀏覽網頁或最小化瀏覽器 或切換至...

HTML5開發 桌面提醒功能

桌面通知功能能夠讓瀏覽器即使是最小化狀態也能將訊息通知給使用者。這和webim是最為天然的結合。不過,目前支援desktop notification功能的瀏覽器只有chrome5 在實際使用的過程中,應該儘量減少通知功能對使用者的干擾,最大程度的減少通知功能的出現,這就需要解決以下幾個問題 win...