У меня есть этот кусок jQuery, который в настоящее время увеличивает число за один раз каждые 5 секунд. Проблема у меня в том, что ее клиентская сторона, поэтому она сбрасывается каждый раз, когда вы обновляете страницу.
Вместо этого я бы хотел, чтобы счетчик продолжался, даже если вы отсутствуете на сайте, и независимо от того, сколько раз вы обновляете страницу, поэтому я подумал, что сценарий на стороне сервера, такой как PHP, лучше подходит для моего использования. Если нет, предложите другое.
Я установил рабочую скрипту того, что у меня есть в jQuery: http://jsfiddle.net/f354bzy5/
Каким будет PHP для воссоздания этого эффекта, который включает мои требования выше?
Вот JQuery, который я использую:
//Counter var counter = 22000000000; $(".count").html(counter); setInterval(function () { $(".count").html(counter); ++counter; }, 5000);
Проверьте этот ДЕМО
//Counter var counter=22000000000; if(typeof(localStorage.getItem('counts'))!='object') { counter=parseInt(localStorage.getItem('counts')); } setInterval(function () { $(".count").html(counter); ++counter; localStorage.setItem('counts',counter); }, 1000);
Выделить на localStorage
localStorage
– это реализация интерфейса хранения. Он хранит данныеno expiration date
и очищается только черезJavaScript
или очищаетBrowser Cache
/Locally Stored Data
– в отличие от срока действия cookie.
Вы можете хранить счетчик в cookie.
document.cookie = counter.
поэтому вы можете получить последнее значение из файла cookie, если пользователь обновит страницу.
Это сводится к двум простым выборам для вас. Просто выберите правильный, который лучше соответствует вашему требованию:
Выберите «Cookie» : если вы хотите, чтобы серверная сторона имела доступ к счетчику. Помните, что файлы cookie отправляются вместе с запросами по умолчанию.
Выберите «Локальное хранилище» . Если вы не хотите отправлять счетчик вместе с запросами каждый раз, вы должны пойти на локальное хранилище.
Вы можете сделать это с помощью localStorage
. Вот как я это делаю. Вы можете настроить его, как вам нужно.
//detecting support for localStorage. if (window.localStorage) { //counterValue already exists in localStorage? Let's use that or set to zero. var counterValue = localStorage.counterValue || 0; setInterval(function() { //increment the counter and store updated vale in localStorage as well. localStorage.counterValue = ++counterValue; //put it in your HTML if you might $(".count").html(counterValue); }, 5000); }
Как насчет использования localStorage
с некоторыми функциями утилиты? Имейте в виду, что это решение на стороне клиента, и item
будет удален, когда пользователь удалит кеширование / локальные данные браузера и т. Д.
function isLocalStorage() { try { return 'localStorage' in window && window['localStorage'] !== null; } catch(e) { return false; } } function setCounter(key, val) { localStorage.setItem(key, val); } function getCounter(key) { return parseInt(localStorage.getItem(key), 10); } (function() { var key = "myCounter"; var counter = isLocalStorage() && getCounter(key) || 1; var $placeholder = $(".count"); $placeholder.html(counter); setInterval(function () { counter++; $placeholder.html(counter); isLocalStorage() && setCounter(key, counter); }, 2000); }());
– Демо –