soorax
@soorax
Веб дизайнер

Счетчик кликов на js?

Всем привет ребят))) вот у меня есть скрипт, они представлен ниже... это счетчик кликов, но дело в том что при обновлении страницы весь счетчик сбрасывается.... и он может находиться только 1 на странице! как можно сделать что бы при обновление не сбрасывался счет, и что бы можно было много раз вставлять этот скрипт на страницу?

<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
	$('#myObj').click(function() {
		$('#counter').html(+$('#counter').html()+1);
	});
});
</script>
<style>
#myObj {
	border: 1px;width: 100px;height: 100px;
}
</style>
</head>
<body>
<div id="myObj">Click Me</div>
<div id="counter">0</div>
</body>
</html>
  • Вопрос задан
  • 22697 просмотров
Пригласить эксперта
Ответы на вопрос 5
Petroveg
@Petroveg
Миром правят маленькие с#@&ки
Есть механизм localStorage. Подключений библиотек не требует. Поддерживается везде.
if (window.localStorage) {
	var value = localStorage.getItem('count'),
		newvalue = isFinite(value) ? ++value : 0;

	localStorage.setItem('count', newvalue);
	console.log(newvalue);
}
Ответ написан
Комментировать
FAT
@FAT
Developer
Сбрасывается потому что значение нигде не сохраняется, нужно сохранять значение в базе данных или cookie. Обращаю внимание, что локально не работает в некоторых браузерах.

Демонстрация работы

<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.cookie.js"></script>
<script type="text/javascript" language="javascript">
$(document).ready(function() {
	//Если установлены cookie то читаем их и сохраняем значение в переменную, если не установлены то значение переменной = 0
	var nCount = $.cookie('user_count') != undefined ? parseInt($.cookie('user_count')) : 0;
	//Отображаем значение на странице
	$('#counter').html(nCount);

	//Клик по элементу
	$('#myObj').click(function() {
		//Увеличиваем счетчик на единицу
		nCount++;
		//Записываем значение в cookie
		$.cookie('user_count', nCount, { expires: 7, path: '/' });
		//Отображаем значение на странице
		$('#counter').html(nCount);
	});
});
</script>
<style>
#myObj {
	border: 1px;width: 100px;height: 100px;
}
</style>
</head>
<body>
<div id="myObj">Click Me</div>
<div id="counter"></div>
</body>
</html>
Ответ написан
@andreyqin
При каждом клике записываете значение счетчика в куки. После обновления страницы проверяете, есть ли кука с именем счетчика, если есть - записываете значение куки в элемент счетчика.
Ответ написан
Комментировать
@wemax
Лучше использовать готовый счетчик.
Ваш код для каждого будет индивидуален, поэтому у всех изначально будет 0.
<div id="qooi-counter">
<a href="http://qooi.ru/" title="Бесплатный счетчик посещений на сайт">
<img src="http://qooi.ru/counter/standard/009.png" alt="Счетчик посещаемости и статистика сайта">
<div id="qooi-counter-visits"></div>
<div id="qooi-counter-views"></div>
</a>
</div>
<script type="text/javascript" src="http://qooi.ru/counter.js"></script>


009.pngВыбрать счетчик >>>>>>
Ответ написан
Комментировать
amurcoder
@amurcoder
Web Developer
Счетчик кликов на сайте с сохранением в файл или БД
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы