html5桌面通知,notification的使用,右下角出現通知框

1先判斷瀏覽器是否支持：window.Notification

2判斷瀏覽器是否開啓提示的權限：Notification.permission === 'granted'（若是不容許則設置爲容許：Notification.requestPermission()）

3設置提示的內容：var notification = new Notification('訂單提示', { body: "您有新訂單：" + data + "" });//Notification("標題","內容")

4能夠設置其餘功能好比消息點擊事件：notification.onclick = function (e) {
                            　　　　　　　　　　　　　　　　　　　　alert("點擊")
                       　　　　　　　　　　　　　　　　　　　　　　 }

例：

if (window.Notification) {                      if (Notification.permission === 'granted' ) {                          var notification = new Notification( '標題' , { body: "內容能夠本身隨便定義" });                          notification.onclick = function (e) {                              alert( "點擊了我" ) //能夠點擊打開一個網址                          }                      } else {                          Notification.requestPermission(); //設置容許通知                      }                  }

拓展：內容可設置屬性以下：

1. dir : 文字的方向；它的值能夠是 auto（自動）, ltr（從左到右）, or rtl（從右到左）
2. lang: 指定通知中所使用的語言。
3. body: 通知中額外顯示的字符串
4. tag: 賦予通知一個ID，以便在必要的時候對通知進行刷新、替換或移除。
5. icon: 一個圖片的URL，將被用於顯示通知的圖標。

 可用事件以下：

• Notification.onclick處理 click 事件的處理。每當用戶點擊通知時被觸發。
• Notification.onshow處理 show 事件的處理。當通知顯示的時候被觸發。
• Notification.onerror處理 error 事件的處理。每當通知遇到錯誤時被觸發。
• Notification.onclose處理 close 事件的處理。當用戶關閉通知時被觸發。

關閉通知的實例方法：

1 2	var n = new Notification(theTitle,options);    setTimeout(n.close.bind(n), 4000);