반응형
바탕 화면 알림을 생성 한 Chrome 탭에 초점을 맞추는 방법은 무엇입니까?
현재 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
하거나 바닐라 자바 스크립트에 사용하거나 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();
});
그것은해야 this.close()
보다는 this.cancel()
이 같은 :
var n = window.webkitNotifications.createNotification('ico.gif','Title', 'Text');
n.onclick = function(x) { window.focus(); this.cancel(); };
n.show();
반응형
'programing' 카테고리의 다른 글
mysql2 및 rails3 (번 들러)의 RuntimeError (0) | 2020.10.16 |
---|---|
Mongo 문서를 삽입 한 후 업데이트하려면 어떻게합니까? (0) | 2020.10.16 |
moment.js를 사용하여 날짜를 "MM / dd / yyyy"문자열로 변환 (0) | 2020.10.16 |
서버 측에서 Android 앱 구매를 확인하는 방법 (앱 결제 v3의 Google Play) (0) | 2020.10.16 |
Erlang 프로그래밍을위한 좋은 IDE는 무엇입니까? (0) | 2020.10.16 |