Событие при каждом третьем посещении

[Alexodiy]

Доброго времени суток, уважаемые форумчане.

Не понимаю как запустить событие при каждом третьем посещении страницы.

Хочу использовать для этого LocalStorage и sessionStorage. Может кто подсказать, показать пример как этого добиться.

[рони]

Alexodiy,

document.addEventListener("DOMContentLoaded", function() {
    var num = localStorage.getItem("num") || 0,
        today = sessionStorage.getItem("today");
    if(today === "yes") return;
    sessionStorage.setItem("today", "yes");
    num = +num + 1;
    localStorage.setItem("num", ""+num);
    if(num % 3 === 0 ) alert("3");
});

[Alexodiy]

document.addEventListener("DOMContentLoaded", function() {
    var num = localStorage.getItem("num") || 0,
        today = sessionStorage.getItem("today");
    if(today === "yes") return;
    sessionStorage.setItem("today", "yes");
    num = +num + 1;
    localStorage.setItem("num", ""+num);
    if(num % 3 === 0 ) alert("3");
});

Я смысл понял, но данный код почему то не работает.

[Malleys]

Я смысл понял, но данный код почему то не работает.

Он работает... он срабатывает на третий раз, если открывать вкладку... Кстати можно попроще... (нажмите запустить и закройте вкладку, откройте снова нажмите запустить... на третий раз сработает)

<script>
	document.addEventListener("DOMContentLoaded", function() {
		var num = Number(localStorage.num) || 0;
		if(sessionStorage.today === "yes") return;
		sessionStorage.today = "yes";
		localStorage.num = ++num;
		if(num % 3 === 0) alert("3");
	});
</script>

если вам надо при третьем обновлении страницы, то можно так... (нажмите три раза кнопку запустить)

<script>
	document.addEventListener("DOMContentLoaded", function() {
		var num = Number(localStorage.num) || 0;
		localStorage.num = ++num;
		if(num % 3 === 0) alert("3");
	});
</script>

[Alexodiy]

да работает, спасибо. а можно ли остановить выполнение например по клику по кнопке? это получается просто переменную num переписать?

Или объявить новый localStorageи на него завязать, если например кликнули по кнопке, то больше ничего не делаем, а если не нажимали прогнем выше написанное условие

[Malleys]

Вы имеете в виду, чтобы при нажатии на кнопку вообще больше не запускалось?

Вот пример с возможностью включения и отключения запуска... Если на кнопке стоит галочка, то оно запускается через три раза, если не стоит галочка, то не запускается

<script>
	document.addEventListener("DOMContentLoaded", function() {
		var checkbox = document.getElementById("toggle-launch");
		checkbox.addEventListener("change", function() {
			localStorage.launch = checkbox.checked;
			
			if(!checkbox.checked) localStorage.num = 0;
		});
		if("launch" in localStorage) {
			checkbox.checked = localStorage.launch === "true";
		} else {
			localStorage.launch = checkbox.checked;
		}
		
		if(!checkbox.checked) return;
		
		var num = Number(localStorage.num) || 0;
		localStorage.num = ++num;
		if(num % 3 === 0) alert("3");
	});
</script>

<label><input type="checkbox" id="toggle-launch" checked>Запускать</label>
<script></script>

[Alexodiy]

Да именно, только по клику по линку, а не через инпут. Спасибо, я все пнял.

[Malleys]

только по клику по линку

Это совершенно неправильно так делать! Используйте либо <button> либо <input>. Ссылка <a> предназначена, чтобы совершать переход на другой документ, здесь такого нет, поэтому используйте подходящий элемент! (кнопку или чек-бокс, чтобы показать текущее состояние!)

Также насчёт обмана и заблуждении, в которые вас ввели: на самом деле эти элементы могут быть стилизованы при помощи CSS!

[Alexodiy]

Malleys, так у меня и планируется переход на другой документ. Смысл такой, по событию падают уведомляшки с просьбой перейти на другую страницу, так вот если пользователь переходит, то эти уведомления я отрубаю.

[Alexodiy]

Это совершенно неправильно так делать! Используйте либо <button> либо <input>. Ссылка <a> предназначена, чтобы совершать переход на другой документ, здесь такого нет, поэтому используйте подходящий элемент! (кнопку или чек-бокс, чтобы показать текущее состояние!)

Также насчёт обмана и заблуждении, в которые вас ввели: на самом деле эти элементы могут быть стилизованы при помощи CSS!

А как лучше сделать, тоесть вместо localStorage.launch = checkbox.checked; сделать событие например

$(".link").on("click", function(){
// тут запишем ключ и по нему потом проверяем вместо checkbox.checked
}

?