Javascript/Adobe DTM: флажок отслеживания щелкает только один раз

Во-первых, как обычно, извините, если этот ответ существует, но я искал и не смог найти ответ, который я ищу.

Я пытаюсь отслеживать действие флажка ввода только один раз, то есть, если у меня есть список флажков, которые я хочу отслеживать, только если пользователь нажал на него один раз, поэтому, даже если они отменят выбор флажка, они отслеживают только первый щелчок.

Я знаю, что есть способ проверить, был ли установлен флажок в JS с помощью вызова типа querySelector().input, но я не знаю, как сделать этот полный круг, чтобы событие отслеживания срабатывало только один раз, независимо от того, сколько раз пользователь переключает его .

Рассмотрим следующую разметку:

  <li class="js-form-item form-item form-item__item form-item--checkbox__item">
    <span class="checkbox"> 
      <input view_id="explore" display_id="explore_main" data-drupal-selector="edit-category-title-app" type="checkbox" id="edit-category-title-app" name="category[title_app]" value="title_app" class="form-checkbox form-item__textfield">
        <label for="edit-category-title-app" class="checkbox__label">
          <span class="checkbox__faux"></span><span class="form-item__label">App</span>
        </label>
     </span>
</li>

Любая помощь будет принята с благодарностью. Только ванильный JS, пожалуйста.


javascript event-tracking dom-events adobe
person Leo_Taco    schedule 01.03.2018    source источник
comment
Возможный дубликат Выполнять событие только один раз?   -  person E. Sundin    schedule 02.03.2018
comment
Может быть, нет, поскольку суть моего вопроса заключается в том, как реализовать в DTM, а не в скрипте страницы.   -  person Leo_Taco    schedule 02.03.2018

Ответы (1)


arrow_upward
-1
arrow_downward

Прикрепите прослушиватель событий и удалите его, когда он сработает.

function addEventListenerOnce(target, type, listener) {
    target.addEventListener(type, function fn(event) {
        target.removeEventListener(type, fn);
        listener(event);
    });
}

addEventListenerOnce(document.getElementById("edit-category-title-app"), "change", function (event) {
    alert("You'll only see this once!");

    // DTM call here
});

См. этот сообщение

person sliptype    schedule 01.03.2018
comment
Если вы нашли идентичный вопрос (из которого вы скопировали свой ответ), вам следует вместо этого пометить его как дубликат. - person E. Sundin; 02.03.2018
comment
Спасибо, но я бы не согласился с тем, что это дубликат, поскольку настоящая проблема моего вопроса заключается в том, как реализовать это в DTM, системе управления тегами, вместо сценария страницы. - person Leo_Taco; 02.03.2018
comment
Я думаю, что ключ заключается в том, чтобы подключить клиентскую часть обработчика событий и запустить пользовательское событие, которое подхватывается DTM. Я не думаю, что вы можете сделать что-то исключительно в самой DTM, чтобы добиться этого. - person sliptype; 02.03.2018