Как получить фокус на вкладке Chrome, которая создала уведомление рабочего стола?
Я хотел бы реализовать ту же функциональность, что и Gmail в настоящее время. Когда приходит новое письмо или новый чат, появляется всплывающее уведомление, и если вы нажмете на него, вкладка с Gmail фокусируется.
У меня есть этот код:
var n = window.webkitNotifications.createNotification('ico.gif', 'Title', 'Text');
n.onclick = function(x) { this.cancel(); };
n.show();
когда я нажимаю уведомление, оно просто исчезает. Теперь мне нужно добавить код в функцию onclick, чтобы открыть и сфокусировать страницу, которая создала это уведомление. Я знаю, что это возможно, потому что GMail делает это очень хорошо. Но я не преуспейте в поиске источников Gmail (они минимизированы и запутаны).
кто-нибудь знает, как это сделать ?
5 ответов
вы можете просто разместить окна.фокус () в Google Chrome. Он будет фокусироваться на этом окне при нажатии.
var n = window.webkitNotifications.createNotification('ico.gif', 'Title', 'Text');
n.onclick = function(x) { window.focus(); this.close(); };
n.show();
Я открыл инспектор в Gmail, добавил выше код, перешел на другую вкладку, и побежал. Уведомление появилось и после нажатия, оно вернуло меня в Gmail.
С помощью уведомления.
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();
};
});
window.focus()
не всегда работает в последних версиях браузера Webkit (Chrome, Safari и т. д.). Но!--2--> делает.
вот полный jsfiddle:https://jsfiddle.net/wv0w7uj7/3/
код:
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();
};
}
}
это не очень хорошая практика, чтобы использовать onclick
свойства, используйте addEventListener
для ванильного javascript или on
метод для jQuery.
var notify = new Notification('Test notification');
Ванильное:
notify.addEventListener('click', function(e) {
window.focus();
e.target.close();
}, false);
jQuery:
$(notify).on('click', function(e) {
window.focus();
e.target.close();
});
Он должен быть!--1-->, а не this.cancel()
, например:
var n = window.webkitNotifications.createNotification('ico.gif','Title', 'Text');
n.onclick = function(x) { window.focus(); this.cancel(); };
n.show();