Komentar: Pemberitahuan desktop di HTML5 dapat memunculkan kotak pesan di jendela halaman saat ini. Kotak pesan ini mencakup jendela tab. Pengingat ini lebih nyaman ketika pengguna membuka beberapa tab untuk menelusuri halaman web dan mudah dilihat.
Pemberitahuan desktop di HTML5 dapat memunculkan kotak pesan di jendela halaman saat ini. Kotak pesan ini mencakup jendela tab. Pengingat ini lebih nyaman dan mudah bagi pengguna untuk melihat ketika pengguna membuka beberapa tab untuk menelusuri halaman web. Saat ini, selama kernel webkit mendukung fungsi ini.Fitur ini perlu diaktifkan dalam Chrome dalam mode HTTP.
Fungsi Pengingat Desktop diimplementasikan oleh Window.webkitnotification Object (Kernel WebKit).
Objek window.webkitnotifications tidak memiliki atribut, dan ada empat metode:
1. Penerimaan ()
Metode ini digunakan untuk meminta izin pengingat pesan kepada pengguna. Jika izin saat ini tidak dibuka, browser akan memunculkan antarmuka otorisasi. Setelah pengguna mengesahkan, nilai status (bilangan bulat 0, 1 atau 2) dihasilkan di dalam objek:
0: Ini berarti bahwa pengguna menyetujui pengingat pesan, dan fungsi pengingat informasi hanya dapat digunakan dalam keadaan ini;
1: Menunjukkan status default, pengguna tidak menolak atau setuju;
2: Menunjukkan bahwa pengguna menolak pengingat pesan.
2.CheckperMission ()
Metode ini digunakan untuk mendapatkan nilai status izin yang diminta oleh RequestPerMission ().
3.createNotification ()
Metode ini membuat pesan pengingat dalam pesan murni, yang menerima tiga parameter string:
IconUrl: Alamat ikon yang ditampilkan dalam pesan,
Judul: Judul pesan,
Tubuh: Konten Teks Tubuh Pesan
Metode ini akan mengembalikan objek pemberitahuan, yang dapat diatur untuk lebih banyak.
Properti dan Metode Objek Pemberitahuan:
Dir: ""
OnClick: Null
Onclose: Null
ondisplay: function (event) {
OneError: NULL
Onshow: Null
ganti: ""
Tag: ""
__Proto__: Pemberitahuan
addeventListener: function addeventListener () {[kode asli]}
Batal: Function cancel () {[kode asli]}
tutup: function tutup () {[kode asli]}
Konstruktor: Fungsi notifikasi () {[kode asli]}
DispatchEvent: Function DispatchEvent () {[kode asli]}
RemestEventListener: Function RemestEventListener () {[kode asli]}
Tampilkan: function show () {[kode asli]}
__Proto__: Objek
Dir: Atur arah pengaturan pesan, nilainya dapat diambil sebagai otomatis (otomatis), LTR (kiri ke kanan), RTL (kanan ke kiri).
Tag: Tambahkan nama tag ke pesan. Jika properti ini diatur, ketika ada pengingat pesan baru, pesan dengan label yang sama hanya akan ditampilkan di kotak pesan yang sama, dan kotak pesan yang terakhir akan menggantikan yang sebelumnya. Jika tidak, beberapa kotak prompt pesan akan muncul, tetapi nilai maksimum akan menampilkan 3 kotak pesan, jika lebih dari 3, pemberitahuan pesan berikutnya akan diblokir.
Onshow: Pemicu saat kotak pesan ditampilkan;
OnClick: Acara ini dipicu saat kotak pesan diklik;
Onclose: memicu saat pesan ditutup;
Onerror: memicu peristiwa saat kesalahan terjadi;
metode:
AddEventListener && RemoveVentListener: Umum Tambah dan Hapus Metode Acara;
Tampilkan: Tampilkan kotak pengingat pesan;
Tutup: Tutup kotak pengingat pesan;
Batal: Tutup kotak Pengingat Pesan, Sama Like Close;
4.createhtmlnotification ()
Perbedaan antara metode ini dan createNotification () adalah bahwa ia membuat pesan dalam HTML, menerima parameter: URL file HTML, dan metode ini juga mengembalikan objek pemberitahuan.
Contoh:
<! Doctype html>
<Html>
<head>
<title> notifikasi di html5 </title>
</head>
<body>
<sorm>
<input type = "tombol" value = "kirim pemberitahuan" />
</form>
<type skrip = "Teks/JavaScript">
document.geteLementById ("trynotification"). onclick = function () {
notify (math.random ());
};
function notify (tab) {
if (! window.webkitnotifications) {
mengembalikan false;
}
var izin = window.webkitnotification.checkpermission ();
if (izin! = 0) {
window.webkitnotifications.RequestperMission ();
var requestTime = new Date ();
var WaitTime = 5000;
var checkperminisc = 100;
setTimeout (function () {
izin = window.webkitnotification.checkpermission ();
if (izin == 0) {
CreateNotification (tab);
} lain jika (tanggal baru ()-requestTime <waittime) {
setTimeout (argumen.callee, checkminisisec);
}
}, checkPerminisesec);
} lain jika (izin == 0) {
CreateNotification (tab);
}
}
function createNotification (tab) {
var menunjukkan = 10000;
var icon = "http://tech.baidu.com/resource/img/logo_news_137_46.png";
var + tanggal baru (). Tolocaletimestring () + "] Tutup setelah" + (showec/1000) + "detik";
var body = "Halo dunia, saya adalah informasi Webkitnotifications";
var popup = window.webkitnotification.createNotification (ikon, judul, tubuh);
popup.tag = tab;
popup.ondisplay = function (event) {
setTimeout (function () {
event.currentTarget.cancel ();
}, showec);
}
popup.show ();
}
</script>
</body>
</html>