Таймер обратного отсчета Javascript, который останавливается, когда окно не находится в фокусе

Хорошо, у меня возникли проблемы с этим, я разработчик php / C # и не имею опыта или знаний в Javascript, мне нужно сделать только одну вещь, которая нуждается в Javascript:

Когда загружается определенная страница, начинается счетчик. Клиент должен оставаться на этой странице в течение 20 секунд. после, я хочу выполнить php-код.

Итак, есть два вопроса, касающихся меня: во-первых: как остановить счетчик, если клиент покидает страницу (это означает, что страница не находится в фокусе).

2) Как я могу выполнить php в javascript? , или вызовите функцию php из Javascript.

Код, который у меня есть, следующий:

<html> <head> </head> <body> <div id='timer'> <script type="text/javascript"> COUNTER_START = 20 function tick () { if (document.getElementById ('counter').firstChild.data > 0) { document.getElementById ('counter').firstChild.data = document.getElementById ('counter').firstChild.data - 1 setTimeout ('tick()', 1000) } else { document.getElementById ('counter').firstChild.data = 'done' } } if (document.getElementById) onload = function () { var t = document.createTextNode (COUNTER_START) var p = document.createElement ('P') p.appendChild (t) p.setAttribute ('id', 'counter') var body = document.getElementsByTagName ('BODY')[0] var firstChild = body.getElementsByTagName ('*')[0] body.insertBefore (p, firstChild) tick() } </script> </div> </body> </html> 

и я также хочу, чтобы таймер начал тикать, когда клиент возвращается на страницу

Большое спасибо за помощь ур

Вы можете сделать это с помощью jQuery.
Утилизируя старый пост Stackoverflow, попробуйте следующее:

 var window_focus; var counter = 1000; // on focus, set window_focus = true. $(window).focus(function() { window_focus = true; }); // when the window loses focus, set window_focus to false $(window).focusout(function() { window_focus = false; }); // this is set to the ('click' function, but you could start the interval/timer in a jQuery.ready function: http://api.jquery.com/ready/ $(document).one('click',function() { // Run this function every second. Decrement counter if window_focus is true. setInterval(function() { $('body').append('Count: ' + counter + '<br>'); if(window_focus) { counter = counter-1; } }, 1000); }); 

Демо и старое сообщение
DEMO | Старый так пост

Обновить
Вероятно, потому что демо работает в 4 iframe, бит $ (window) .focus работает только на iframe, фактически выполняющем код (в нижнем правом окне).

JQuery
jQuery.com (Как работает jQuery) | Пример (назад к основам на полпути вниз страницы) | Если вы используете вторую ссылку, прочитайте также

Что касается вашего первого вопроса об обнаружении, если окно не в фокусе, см. Этот ответ: есть ли способ определить, не открыто ли окно браузера?

Это возможно, но только очень новые браузеры поддерживают это, поэтому могут быть не полезны на основе текущей поддержки браузера.

Чтобы запустить PHP-код из Javascript, вам нужно сделать вызов AJAX на серверный PHP-скрипт для вызова PHP, поскольку JS является клиентской, а PHP – серверной.