Làm cách nào để tập trung vào tab Chrome đã tạo thông báo trên màn hình?

Tôi muốn triển khai chức năng tương tự như Gmail ngày nay. Khi có email mới hoặc có cuộc trò chuyện mới, cửa sổ bật lên thông báo sẽ xuất hiện và nếu bạn nhấp vào đó, tab có Gmail sẽ được lấy tiêu điểm.

Tôi có mã này:

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

Khi tôi nhấp vào thông báo, nó làm cho nó biến mất. Bây giờ tôi cần thêm một số mã vào chức năng onclick để hiển thị và tiêu điểm trang đã tạo thông báo này. Tôi biết điều đó là hoàn toàn có thể vì GMail làm điều đó rất tốt. Nhưng tôi đã không thành công khi xem xét các nguồn Gmail (chúng được tối giản hóa và khó hiểu).

Có ai biết làm thế nào để làm điều này?

Bạn chỉ có thể đặt window.focus () trong Google Chrome. Nó sẽ tập trung vào cửa sổ đó khi được nhấp vào.

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

Tôi đã mở trình kiểm tra trong Gmail, thêm mã ở trên, chuyển sang một tab khác và chạy nó. Thông báo xuất hiện và sau khi nhấp vào, nó đưa tôi trở lại Gmail.

Sử dụng Thông báo .

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()không phải lúc nào cũng hoạt động trong các phiên bản trình duyệt Webkit gần đây (Chrome, Safari, v.v.). Nhưng parent.focus()không.

Đây là một jsfiddle hoàn chỉnh: https://jsfiddle.net/wv0w7uj7/3/

Mã:

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

Việc sử dụng thuộc onclicktính này không thực sự tốt , sử dụng addEventListenercho javascript vani hoặc onphương thức cho jQuery.

var notify = new Notification('Test notification');

Vanilla:

notify.addEventListener('click', function(e) {
    window.focus();
    e.target.close();
}, false);

jQuery:

$(notify).on('click', function(e) {
    window.focus();
    e.target.close();
});

Nó sẽ được this.close()khá hơn this.cancel(), như thế này:

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