Добрый день, уважаемые форумчане!
Сайт собран на Tilda.
Мне необходимо трекать кнопку, которая отправляет форму. Блок, в котором находится эта кнопка, собран в Zero блоке.
Нужно сделать это именно через Javascript событие, то есть отслеживать открытие виртуальной страницы, как предлагает это делать Tilda, не вариант.
Для других кнопок на сайте, которые открывают popup, а не отправляют сразу данные, это оказалось достаточно просто - я отлавливаю открытие ссылки вида #XXXXXXXXXX, и трекаю этот клик.
<script>
$(document).ready(function () {
//цель "Заказать звонок - клик" для Метрики
$("[href='#popup:callorder']").click(function () {
if (window.mainMetrikaId !== undefined) {
yaCounter57198521.reachGoal('zakazat-zvonok');
}
});
//цель "Заказать звонок - клик" для GA
$("a").click(function (e) {
var url = $(this).attr('href');
if (url.indexOf('#popup:callorder') != -1) {
e.preventDefault();
gtag('event', 'click', {
'event_category': 'general',
'event_label': 'callback'
});
setTimeout(function () {
window.location = url;
}, 200);
}
});
</script>
Очевидно, что предыдущий способ не подходит для отслеживания кнопки, которая сразу отправляет данные.
Я предположил, что могу найти кнопку методом querySelectorall и далее добавить к ней нужно мне действие через Onclick.
Как это выглядит в моём исполнении:
<script>
var b1 = document.querySelectorAll ('button') [1];
b1.onclick = function () {
console.log ("Button1 clicked");
dataLayer.push ({
yaCounter57198521.reachGoal('forma');
gtag('event', 'submit', {
'event_category': 'forms',
'event_label': 'callback_send'
});
}
</script>
Однако, данная конструкция не работает. Кнопку получается найти и переменной объявить, а при добавлении Onclick появляется ошибка в консоли:
Uncaught TypeError: Cannot set properties of undefined (setting 'onclick')
И, соответственно, ничего не работает.
Прошу помочь разобраться. Что я делаю не так и как всё-таки можно решить проблему?