0

Имеются select'ы, которые вставляются в документ динамический, их изменения обрабатывают так:

document.addEventListener('change', function(event) {
    if(event.target.contains('select-class')) { ... }
});

Иногда меняю их значения через value: "select.value = value;". Когда меняю значение, то событие не вызывается. Пробовал вот так:

select.dispatchEvent(new Event('change'));
...
document.dispatchEvent(new Event('change'));

Ничего из этого не сработало. Как я могу это решить?

1

2 ответа 2

2

вторым аргументом передается обект с свойствами например разрешить всплытие

dispatchEvent(new Event('change',{bubbles:true}))

но в твоем примере с document.dispatch все должно работать и без всплытия там пропушена скобка

мне кажется ты не правильно понял темы делегирования и слушателей вообше есть не только всплытие но и погружение если у тебя слушатель на элементе а событие срабатывает на родителе тебе надо ловить на погужении и обратная логика если переставить местами то на всплытии.Какие параметры за это отвечають можно глянуть в любой документации.Что касается сгенерированных событий то есть не пользовательских они по дефолту не умеют всплывать про пагружение не помню так что если слушатель на документе а событие генерируется на элементе то надо обязательно указать {bubbles:true} что бы оно всплыло до документа

1
  • document.dispatchEvent(new Event('change', {target: select})); так не получается. Как я понял там можно только определенные параметры передать developer.mozilla.org/en-US/docs/Web/API/Event/Event
    – Bamberg
    22 дек 2020 в 6:57
0

Не знаю насколько это правильно, но для меня это работает

// при изменении селекта
let changeEvent = new Event('change');
changeEvent._target = control;
document.dispatchEvent(changeEvent);

// в обработчике
document.addEventListener('change', function(event) {
    const target = event._target || event.target;
    if(target.contains('select-class')) { ... }
});

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.