Отслеживание нескольких кликов на одном элементе

Question

Ищем способ отследить, если элемент был нажат несколько раз (например, пользователь нажимает кнопку «Отправить» несколько раз, чтобы разместить заказ).

Мы делаем некоторую работу по перестройке сайтаи в нашем исследовании UX мы обнаружили, что люди не скачивают PDF-файлы с сайта, потому что ссылка за кнопкой не работает.Мы заметили, что люди, как правило, нажимают на кнопку несколько раз, прежде чем сдаться, но некоторым все же удается загрузить PDF.

Чтобы показать, что наши изменения в коде улучшили производительность сайта и пользовательский опыт, мы хотим показатьчто эти «множественные клики» уменьшились.

Поскольку сайт использует Google Analytics, я попытался создать в GTM переменную, которая будет подсчитывать клики по одному и тому же элементу клика (который не работает):

function() {
var the_div = {{Click Element}};
var clickCount = 0;                      
return clickCount;                      
}

Я ожидаю, что результат будет подсчитывать количество нажатий на элемент Click (1, 2, 3 и т. Д ....)

Answer 1

Использовать javascript переменную с глобальной областью действия

<script>
countClicks = 0;
    function clickCountFunction() {
         countClicks++;
         alert("Hello there!");
    }
</script>

Добавить атрибут onClick в кнопку и вызвать clickCountFunction() в ней

Answer 2

извините за задержку с ответом. Мы нашли решение.

Как отметил Пиртсторфф, переменная устанавливает значение clickCount равным нулю при каждом вызове. Решение состояло в том, чтобы создать пользовательский тег HTML (который запускает JS), а не переменную, который запускается по триггеру загрузки страницы и прослушивает несколько кликов в течение 2-секундного периода. Затем HTML-тег передает событие в DataLayer и сохраняется в переменной.

Эта переменная (сигнализирующая о нескольких кликах) активирует триггер для другого тега, который передает переменную {{Click Classes}} в GA

Answer 3

Попробуй вот так.

Определи варазил для подсчета.и при каждом клике увеличивайте его.

var i = 1;
$('#elem').on('click',function(){
  console.log(i);
  i++;
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="elem">click here</div>