ความคิดเห็น: การแจ้งเตือนเดสก์ท็อปใน HTML5 สามารถปรากฏขึ้นในกล่องข้อความในหน้าต่างหน้าปัจจุบัน กล่องข้อความนี้ครอบคลุมหน้าต่างแท็บ การเตือนความจำนี้สะดวกยิ่งขึ้นเมื่อผู้ใช้เปิดแท็บหลายแท็บเพื่อเรียกดูหน้าเว็บและมองเห็นได้ง่าย
การแจ้งเตือนเดสก์ท็อปใน HTML5 สามารถปรากฏขึ้นในกล่องข้อความในหน้าต่างหน้าปัจจุบัน กล่องข้อความนี้ครอบคลุมหน้าต่างแท็บ การเตือนความจำนี้สะดวกกว่าและง่ายขึ้นสำหรับผู้ใช้ที่จะเห็นว่าผู้ใช้เปิดแท็บหลายแท็บเพื่อเรียกดูหน้าเว็บ ปัจจุบันตราบใดที่เคอร์เนล WebKit รองรับฟังก์ชั่นนี้คุณลักษณะนี้จะต้องเปิดใช้งานใน Chrome ในโหมด HTTP
ฟังก์ชั่นการเตือนเดสก์ท็อปถูกนำมาใช้โดย Window.webkitNotifications Object (เคอร์เนล WebKit)
วัตถุ Window.webkitNotifications ไม่มีคุณสมบัติและมีสี่วิธี:
1. การรับส่งข้อมูล ()
วิธีนี้ใช้เพื่อขออนุญาตเตือนข้อความถึงผู้ใช้ หากการอนุญาตไม่ได้เปิดในปัจจุบันเบราว์เซอร์จะปรากฏขึ้นส่วนต่อประสานการอนุญาต หลังจากที่ผู้ใช้อนุญาตค่าสถานะ (จำนวนเต็มเท่ากับ 0, 1 หรือ 2) ถูกสร้างขึ้นภายในวัตถุ:
0: หมายความว่าผู้ใช้เห็นด้วยกับการแจ้งเตือนข้อความและสามารถใช้ฟังก์ชั่นการเตือนข้อมูลในสถานะนี้เท่านั้น
1: ระบุสถานะเริ่มต้นผู้ใช้ไม่ปฏิเสธหรือเห็นด้วย
2: ระบุว่าผู้ใช้ปฏิเสธการแจ้งเตือนข้อความ
2. Checkpermission ()
วิธีนี้ใช้เพื่อรับค่าสถานะของการอนุญาตที่ร้องขอโดย requestpermismission ()
3.Createnotification ()
วิธีนี้สร้างข้อความเตือนความจำในข้อความบริสุทธิ์ซึ่งยอมรับพารามิเตอร์สตริงสามตัว:
ICONURL: ที่อยู่ไอคอนที่แสดงในข้อความ
ชื่อเรื่อง: ชื่อเรื่องของข้อความ
ร่างกาย: ข้อความเนื้อหาข้อความข้อความ
วิธีนี้จะส่งคืนวัตถุการแจ้งเตือนซึ่งสามารถตั้งค่าได้เพิ่มเติม
คุณสมบัติและวิธีการของวัตถุการแจ้งเตือน:
Dir: ""
onclick: null
onclose: null
ondisplay: ฟังก์ชั่น (เหตุการณ์) {
OneERROR: NULL
onshow: null
แทนที่: ""
Tag: ""
__proto__: การแจ้งเตือน
addeventListener: ฟังก์ชั่น addeventListener () {[รหัสดั้งเดิม]}
ยกเลิก: ฟังก์ชั่นยกเลิก () {[รหัสดั้งเดิม]}
ปิด: ฟังก์ชั่นปิด () {[รหัสดั้งเดิม]}
ตัวสร้าง: การแจ้งเตือนฟังก์ชัน () {[รหัสดั้งเดิม]}
dispatchevent: ฟังก์ชั่น dispatchevent () {[รหัสดั้งเดิม]}
removeEventListener: ฟังก์ชั่น removeEventListener () {[รหัสดั้งเดิม]}
แสดง: function show () {[รหัสดั้งเดิม]}
__proto__: วัตถุ
DIR: ตั้งค่าทิศทางการจัดเรียงของข้อความค่าสามารถใช้เป็นอัตโนมัติ (อัตโนมัติ), LTR (ซ้ายไปขวา), RTL (ขวาไปซ้าย)
Tag: เพิ่มชื่อแท็กลงในข้อความ หากตั้งค่าคุณสมบัตินี้เมื่อมีการแจ้งเตือนข้อความใหม่ข้อความที่มีป้ายกำกับเดียวกันจะปรากฏในกล่องข้อความเดียวกันเท่านั้นและกล่องข้อความหลังจะแทนที่ข้อความก่อนหน้านี้ มิฉะนั้นกล่องพรอมต์ข้อความหลายกล่องจะปรากฏขึ้น แต่ค่าสูงสุดจะแสดง 3 กล่องข้อความหากมากกว่า 3 การแจ้งเตือนข้อความที่ตามมาจะถูกบล็อก
onshow: ทริกเกอร์เมื่อมีการแสดงกล่องข้อความ
OnClick: เหตุการณ์นี้จะถูกเรียกใช้เมื่อคลิกที่กล่องข้อความ
onClose: ทริกเกอร์เมื่อข้อความถูกปิด
Onerror: ทริกเกอร์เหตุการณ์เมื่อเกิดข้อผิดพลาด
วิธี:
AddEventListener && removeEventListener: ทั่วไปเพิ่มและลบวิธีการจัดกิจกรรม;
แสดง: แสดงข้อความแจ้งเตือนข้อความ;
ปิด: ปิดกล่องแจ้งเตือนข้อความ;
ยกเลิก: ปิดกล่องแจ้งเตือนข้อความเช่นเดียวกับปิด
4.CreateHtmlNotification ()
ความแตกต่างระหว่างวิธีนี้และ createnotification () คือมันสร้างข้อความใน HTML การยอมรับพารามิเตอร์: URL ของไฟล์ HTML และวิธีนี้ยังส่งคืนวัตถุการแจ้งเตือน
ตัวอย่าง:
<! doctype html>
<html>
<head>
<title> การแจ้งเตือนใน HTML5 </title>
</head>
<body>
<form>
<อินพุต type = "ปุ่ม" value = "ส่งการแจ้งเตือน" />
</form>
<script type = "text/javascript">
document.getElementById ("trynotification"). onclick = function () {
แจ้ง (math.random ());
-
ฟังก์ชั่นแจ้งเตือน (แท็บ) {
if (! window.webkitnotifications) {
กลับเท็จ;
-
การอนุญาต var = window.webkitnotifications.checkpermission ();
ถ้า (อนุญาต! = 0) {
window.webkitnotifications.requestpermission ();
var requesttime = new date ();
var waittime = 5000;
var checkperminisec = 100;
settimeout (function () {
การอนุญาต = window.webkitNotifications.CheckPermission ();
ถ้า (อนุญาต == 0) {
Createnotification (TAB);
} อื่นถ้า (วันที่ใหม่ ()-requesttime <waittime) {
settimeout (arguments.callee, checkperminisec);
-
}, checkperminisec);
} อื่นถ้า (อนุญาต == 0) {
Createnotification (TAB);
-
-
ฟังก์ชั่น createnotification (แท็บ) {
var showsec = 10,000;
var icon = "http://tech.baidu.com/resource/img/logo_news_137_46.png";
var + วันที่ใหม่ (). tolocaletimestring () + "] ปิดหลังจาก" + (showsec/1000) + "วินาที";
var body = "Hello World, ฉันเป็น webkitnotifications ข้อมูล";
var popup = window.webkitnotifications.createnotification (ไอคอน, ชื่อ, ร่างกาย);
popup.tag = tab;
popup.ondisplay = ฟังก์ชั่น (เหตุการณ์) {
settimeout (function () {
Event.currenttarget.cancel ();
}, showsec);
-
popup.show ();
-
</script>
</body>
</html>