Chciałbym zaimplementować taką samą funkcjonalność, jaką ma obecnie Gmail. Gdy nadejdzie nowa wiadomość e-mail lub pojawi się nowy czat, pojawi się wyskakujące okienko z powiadomieniem, a po jego kliknięciu karta z Gmailem zostanie skoncentrowana.
Mam ten kod:
var n = window.webkitNotifications.createNotification('ico.gif', 'Title', 'Text');
n.onclick = function(x) { this.cancel(); };
n.show();
Kiedy klikam powiadomienie, po prostu znika. Teraz muszę dodać kod do funkcji onclick, aby wyświetlić i zaznaczyć stronę, która utworzyła to powiadomienie. Wiem, że jest to możliwe, ponieważ Gmail robi to bardzo dobrze. Ale nie udało mi się zajrzeć do źródeł Gmaila (są zminimalizowane i zaciemnione).
Czy ktoś wie, jak to zrobić?
Odpowiedzi:
Możesz po prostu umieścić window.focus () w Google Chrome. Po kliknięciu skupi się na tym oknie.
var n = window.webkitNotifications.createNotification('ico.gif', 'Title', 'Text'); n.onclick = function(x) { window.focus(); this.close(); }; n.show();
Otworzyłem inspektora w Gmailu, dodałem powyższy kod, przeniosłem się na inną kartę i uruchomiłem. Pojawiło się powiadomienie i po kliknięciu przeniosło mnie z powrotem do Gmaila.
źródło
Korzystanie z powiadomień .
if (typeof Notification !== 'undefined') { alert('Please us a modern version of Chrome, Firefox, Opera or Safari.'); return; } Notification.requestPermission(function (permission) { if (permission !== 'granted') return; var notification = new Notification('Here is the title', { icon: 'http://path.to/my/icon.png', body: 'Some body text', }); notification.onclick = function () { window.focus(); }; });
źródło
window.focus();
Zrób sztuczkę ! Powinna być oznaczona jako prawidłowa odpowiedź.window.focus()
nie działa na chrome 60, rozwiązanie jazzcat zparent.focus()
działawindow.focus()
nie zawsze działa w najnowszych wersjach przeglądarek Webkit (Chrome, Safari itp.). Aleparent.focus()
tak.Oto kompletny plik jsfiddle: https://jsfiddle.net/wv0w7uj7/3/
Kod:
function notifyMe() { if (Notification.permission !== "granted") Notification.requestPermission(); else { var notification = new Notification('Notification title', { icon: 'http://cdn.sstatic.net/stackexchange/img/logos/so/so-icon.png', body: "You've been notified!", }); notification.onclick = function () { parent.focus(); window.focus(); //just in case, older browsers this.close(); }; } }
źródło
this.close
, lepiej wywołaćevt.target.close
zdarzenie „onclick”:notification.onclick = function (evt) { evt.target.close(); }
Używanie tej
onclick
właściwości nie jest dobrą praktyką , używajaddEventListener
javascript for vanilla lubon
metody dla jQuery.var notify = new Notification('Test notification');
Wanilia:
notify.addEventListener('click', function(e) { window.focus(); e.target.close(); }, false);
jQuery:
$(notify).on('click', function(e) { window.focus(); e.target.close(); });
źródło
Powinno być
this.close()
raczej niżthis.cancel()
tak:var n = window.webkitNotifications.createNotification('ico.gif','Title', 'Text'); n.onclick = function(x) { window.focus(); this.cancel(); }; n.show();
źródło