insertAfter
".primary_menu ul li:nth-child(2)"
let bonus_timer = 5; // глобальный счетчик обратного отсчета
// что-то еще делаем перед началом отсчета
let bonus_timer_handler = setInterval(function()
{
if(bonus_timer > 0)
{
// перерисовать title
bonus_timer--; // уменьшить счетчик
}
else
{
// выдать бонус
clearInteval(bonus_timer_handler); // зачистить генерацию событий setInterval
}
}
, 1000); // обновить состояние bonus_timer каждую секунду
let data = 0;
document.querySelectorAll(".button").forEach(function (btn){
btn.addEventListener("click", function (e){
data += +e.target.parentElement.dataset.step;
rect.style = `transform: rotate(${data}deg);`
this.content.querySelectorAll('.cell').forEach((cell) => {
let timer = null; // дескриптор отложенного обработчика одного клика
cell.addEventListener('click', (e) => {
if(timer)
clearTimeout(timer); // при каждом клике сбрасываем отложенный обработчик обработки одного клика
if(e.detail == 1) // на первом клике устанавливаем отложенный обработчик
timer = setTimeout(handleClickCell, 250); // Выполнение функции по одинарному клику после ожидания второго клика 250мс
if(e.detail == 2) // на втором - выполнение обработчика двойного клика
{
// благодаря счетчику detail в ивенте можем посчитать длину очереди непрерывных кликов, и в нужный момент выполнить функцию на втором клике
console.log('111');
}
} );
});
адаптивности при таком раскладе не возможно добиться
p.s.: я думал сделать сеткой, т.е. типа как пазл картинка состоящая из одинаковых квадратиков (тогда это будет проще)
failed because the user didn't interact with the document first
function getValue()
{
let xhr = new XMLHttpRequest();
xhr.open("POST", "" /*<- тут должен быть адрес скрипта на сервере, где будет обработка запроса */, true);
// создаем виртуальную форму, чтобы нагрузить запрос параметрами
let t_form = new FormData();
// нагружаем параметром форму
t_form.append("input-id", document.getElementById('input-id').value);
// ... еще какой-то параметр
// t_form.append("какой-то параметр", "какое-то значение");
// callback функция ответа
xhr.onreadystatechange = function(e)
{
// состояние, когда ответ сформирован
if(xhr.readyState === 4 && xhr.status === 200)
{
// что-то делаем с ответом, например выводим сообщение
alert(xhr.responseText);
}
};
// отправляем запрос на сервер, нагружаем его формой с параметрами
xhr.send(t_form);
}
// инициализация значений по умолчанию (тело конструктора, если использовать ООП. В классе будете использовать this контекст класса вместо window)
window.is_mouse_catch = false; // зажата ли мышь?
window.mouse_path = 0.0; // путь мыши
// предыдущие координаты мыши
window.cl_X = null;
window.cl_Y = null;
// конец инициализации
// обработчик нажатия кнопки
document.addEventListener('mousedown', function(e)
{
// фиксируем параметры мыши в переменных, за пределами локальной области видимости обработчика
window.is_mouse_catch = true;
window.mouse_path = 0.0;
window.cl_X = e.clientX;
window.cl_Y = e.clientY;
});
// обработчик отпускания кнопки
document.addEventListener('mouseup', function(e)
{
// фиксируем отпускание кнопки мыши в переменной, за пределами локальной области видимости обработчика
window.is_mouse_catch = false;
});
// обработчик движения мыши
document.addEventListener('mousemove', function(e)
{
// если кнопку не нажимали, то прерываем обработчик
if(window.is_mouse_catch === false)
return;
// определяем текущие координаты
let currentX = +e.clientX;
let currentY = +e.clientY;
// считаем дельту пути
let delta = ((currentX - window.cl_X) ** 2 + (currentY - window.cl_Y) ** 2) ** 0.5;
// приращиваем дельту пути к общему результату
window.mouse_path += delta;
// переопределяем предыдущие координаты
window.cl_X = currentX;
window.cl_Y = currentY;
// пишем в лог
console.log('currentX: ' + currentX + '; currentY: ' + currentY + ' delta: ' + delta + '; total_path: ' + window.mouse_path);
});
var currentExtraStackFrame = null; // это нужно, чтобы не словить предупреждение в консоль undefined variable/property при обращении к свойству currentExtraStackFrame
// этим методом вы задаете какое-то значение для свойства currentExtraStackFrame, если его нужно привести в какое-то не null значение (или вернуть в null - значение по умолчанию).
function setExtraStackFrame(stack)
{
// if() тут может была лексема if, можно просто ее закомментить и не убирать скобки, чтобы git не анализировать их исправление, и так будет работать
{
currentExtraStackFrame = stack;
}
}
такой способ представляет угрозу для безопасности
2 + 8 = ?
<?php
if(isset($_POST['checkout']))
{
// получили параметр, который используется в AJAX - отдаем только данные (числа, строки, или json объекты)
echo 'posted:'.$_POST['checkout'];
}
else
{
// не получили специфичных для ajax параметров - отдаем клиенту обычный HTML
echo '<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div><?php echo $test ?></div>
<script type="text/javascript" src="js/jquery-3.6.0.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</body>
</html>';
}
?>