Почему не работает javascript?

Question

[Влад]

Ссылка rayth.ee/hinnad

Если прописать прямо в консоле Хрома данный код, то он отрабатывает успешно, но если этот код вставить в исходный код html страницы, то он не работает.. почему так??

$(".price-table__select").click(function() {
        alert(1);
        gtag('event', 'Клик', { 'event_category': "Калькулятор цены", 'event_label': document.location.href });
    });

Comments

[Алексей Уколов]

Что конкретно вы имеете в виду под «не работает»?

[alex]

оффтоп: у вас там кстати с закрывающимися тэгами муть какая-то:

<p style="text-align: center;"><span style="color: #ffffff; font-size: 14pt;">2. Kui on soovitatud täiendav teenus teie valitud teenusele siis see on välja toodud tähisega «+</p>
<p/p».</span>

[Влад]

Алексей Уколов, alert не срабатывает, gtag тоже - при клике по блоке с классом .price-table__select

[edward_freedom]

Влад, твое событие вызывается после создания dom или перед или во время? Надо после

Answer 1

[alex]

проблема во vue. вы вешаете обработчик на элемент, затем ниже по коду инициализируется вью и этот элемент пересоздает. в результате обработчик привязан к несуществующему элементу. как выход, можно попробовать повесить обработчик в хуке mounted:

mounted() {
  $(".price-table__select").click(function() {
    alert(1);
    gtag('event', 'Клик', { 'event_category': "Калькулятор цены", 'event_label': document.location.href });
  });
}

Comments

[Влад]

сработалО! спасибо!

Answer 2

[Dymok]

Существует ли элемент .price-table__select на момент выполнения скрипта?
Если сделать вот так?

$(document).ready(function () {
$(".price-table__select").click(function() {
        alert(1);
        gtag('event', 'Клик', { 'event_category': "Калькулятор цены", 'event_label': document.location.href });
    });
});

Comments

[Влад]

да, он в исходном коде изначально есть без яваскриптов...
сейчас стоит ваш код - не работает

[Dymok]

Влад, тогда ссылку на код бы

[Влад]

Dymok, в исходном коде страницы ведь весь html код - там же яваскрипт этот.. или вы про чтото другое?

[Dymok]

Влад, возможно, у тебя javascript код выполняется до html-разметки блока .price-table__select, поэтому не работает обработчик событий.
Есть что-то в консоли при загрузке страницы, при клике на элемент .price-table__select?

[Влад]

Dymok, вот скрин консоли - нижние 2 строки появляются после клика по элементу... но это стандартный отработка при работе скрипта...



сейчас перенес код в самый низ исходного кода - не помогло..=/

[Влад]

помог другой человек ниже. спасибо!