[javascript] 바탕 화면 알림을 생성 한 Chrome 탭에 초점을 맞추는 방법은 무엇입니까?

Program / 글쓴이

현재 Gmail과 동일한 기능을 구현하고 싶습니다. 새 이메일이 도착하거나 새 채팅이 오면 알림 팝업이 나타나고 클릭하면 Gmail 탭에 초점이 맞춰집니다.

이 코드가 있습니다.

var n = window.webkitNotifications.createNotification('ico.gif', 'Title', 'Text');
n.onclick = function(x) { this.cancel(); };
n.show();

알림을 클릭하면 사라집니다. 이제이 알림을 생성 한 페이지를 표시하고 초점을 맞추기 위해 onclick 함수에 몇 가지 코드를 추가해야합니다. GMail이 아주 잘하기 때문에 가능하다는 것을 알고 있습니다. 그러나 나는 Gmail 소스를 조사하는 데 성공하지 못했습니다 (최소화되고 난독 화되어 있음).

아무도 이것을하는 방법을 알고 있습니까?

답변

Google 크롬에 window.focus ()를 배치하면됩니다. 클릭하면 해당 창에 초점이 맞춰집니다.

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 등)에서는 항상 작동하지 않습니다. 하지만 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();
    };
  }
}

답변

onclick속성을 사용 addEventListener하거나 바닐라 자바 ​​스크립트에 사용하거나 onjQuery에 메서드 를 사용하는 것은 좋은 습관이 아닙니다 .

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

답변

그것은해야 this.close()보다는 this.cancel()이 같은 :

var n = window.webkitNotifications.createNotification('ico.gif','Title', 'Text');
n.onclick = function(x) { window.focus(); this.cancel(); };
n.show();

답변