Rumah > hujung hadapan web > Tutorial H5 > Pemberitahuan HTML5 (peringatan desktop) contoh penggunaan fungsi_html5 kemahiran tutorial

Pemberitahuan HTML5 (peringatan desktop) contoh penggunaan fungsi_html5 kemahiran tutorial

WBOY
Lepaskan: 2016-05-16 15:48:13
asal
2272 orang telah melayarinya

1. Pengenalan kepada Pemberitahuan HTML5
Pemberitahuan HTML5 ialah pemberitahuan desktop. Pada masa ini, penyemak imbas masih beroperasi dalam mod kotak pasir yang ketat, yang mengasingkan komunikasi antara penyemak imbas dan desktop. Pemberitahuan boleh menjangkau kotak pasir, membolehkan penyemak imbas memberitahu pengguna tentang mesej walaupun ia diminimumkan.
2. Desktop Reminder API

Salin kod
Kodnya adalah seperti berikut:
window.webkitNotifications

API mempunyai 3 kaedah:

Salin kod
Kodnya adalah seperti berikut:
requestPermission request pemberitahuan desktop
checkPermission semak kebenaran pemberitahuan desktop (PERMISSION_ALOWED = 0, PERMISSION_NOT_ALLOWED = 1, PERMISSION_DENIED = 2)
createNotification create desktop notification

3. Contoh Pemberitahuan Desktop
Mari gunakan API pemberitahuan desktop untuk menulis fungsi kecil: hantar mesej pada desktop setiap 20 minit untuk mengingatkan pengguna untuk berehat.
Kod adalah seperti berikut:


Salin kodKod adalah seperti berikut:
if(window.webkitNotifications) {
if(window.webkitNotifications.checkPermission()==0){
setInterval(function(){
var popup = window.webkitNotifications.createNotification("avator.jpg ","Peringatan Hangat Ruhua: ","Mata anda akan buta jika anda menghadap komputer untuk masa yang lama, berehat~");
popup.show();
},1000 * 60 * 20);

}else{
window.webkitNotifications.requestPermission();
}
}else{
alert('Pelayar tidak menyokong pemberitahuan desktop~!');
}

Kemudian desktop akan muncul selepas 20 minit:


Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan