Как получить фокус на вкладке Chrome, которая создала уведомление рабочего стола?

Question

Как получить фокус на вкладке Chrome, которая создала уведомление рабочего стола?

Я хотел бы реализовать ту же функциональность, что и Gmail в настоящее время. Когда приходит новое письмо или новый чат, появляется всплывающее окно уведомления, и если вы его нажмете, вкладка с Gmail будет сфокусирована.

У меня есть этот код:

var n = window.webkitNotifications.createNotification('ico.gif', 'Title', 'Text');

n.onclick = function(x) { this.cancel(); };

n.show();

когда я нажимаю уведомление, оно просто исчезает. Теперь мне нужно добавить некоторый код в функцию onclick, чтобы открыть и сфокусировать страницу, которая создала это уведомление. Я знаю, что это возможно, потому что GMail делает это очень хорошо. Но я не успешно изучите источники Gmail (они минимизированы и запутаны).

кто-нибудь знает, как это сделать ?

652 5

javascript google-chrome notifications webkit gmail

5 ответов:

Comments

Ничего не найдено.

Mohamed Mansour · Accepted Answer · 2018-08-26 04:20:36

вы можете просто разместить окна.фокус () в Google Chrome. Он будет фокусироваться на этом окне при нажатии.
var n = window.webkitNotifications.createNotification('ico.gif', 'Title', 'Text');
n.onclick = function(x) { window.focus(); this.close(); };
n.show();
Я открыл инспектор в Gmail, добавил выше код, перешел на другую вкладку, и побежал. Уведомление появилось и после щелчка, он вернул меня в Gmail.

Oswaldo Alvarez · Accepted Answer · 2016-01-27 22:36:42

С помощью уведомления.

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();
  };
});

jazzcat · Accepted Answer · 2017-01-13 22:12:31

window.focus() не всегда работает в последних версиях браузера Webkit (Chrome, Safari и т. д.). Но parent.focus() делает.

вот полный 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();
    };
  }
}

Tim · Accepted Answer · 2017-01-27 13:14:32

это не очень хорошая практика, чтобы использовать 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();
});

Nadav B · Accepted Answer · 2016-08-11 17:16:55

Он должен быть!--1-->, а не this.cancel(), например:
var n = window.webkitNotifications.createNotification('ico.gif','Title', 'Text');
n.onclick = function(x) { window.focus(); this.cancel(); };
n.show();