триггер не работает под нагрузкой

Question

$(document).ready(function(){
    console.log("1");
    $('#selectid').triggerHandler('change');
    $('#selectid').trigger('change');
    $('#selectid').change();
    console.log("2");
    $('#intervention1-form').change(function() {
        console.log('WHY DOESNT THIS HAPPEN?');
  });
});
console.log("0");

Вывод на консоль должен быть:

0
1
WHY DOESNT THIS HAPPEN?
2

Но вместо этого это просто:

0
1
2

Контекст заключается в том, что я заполняю HTML-элемент различными элементами при изменении меню выбора (selectid). Однако при первой загрузке страницы я хочу вызвать меню выбора, как если бы оно изменилось, чтобы в элементе HTML содержалось содержимое, даже если пользователь не изменил меню выбора.

Answer 1

Потому что вы присоединяете обработчик кликов впоследствии. trigger("change") выполняет все обработчики и поведения, связанные с соответствующими элементами для события change. Если обработчик не подключен, выполнять нечего.

Попробуйте это.

$(document).ready(function(){
    console.log("1");
    $('#intervention1-form').change(function() {
        console.log('WHY DOESNT THIS HAPPEN?');
    });
    $('#selectid').change();
    console.log("2");
});
console.log("2");

Примечание: вызов метода trigger("change") или change() - это одно и то же.

Метод .triggerHandler () ведет себя аналогично .trigger (), с следующие исключения:

• Метод .triggerHandler () не вызывает поведение события по умолчанию (например, отправка формы).
• Хотя .trigger () будет работать со всеми элементами, сопоставленными с объектом jQuery, .triggerHandler () влияет только на первый сопоставленный элемент.
• События, созданные с помощью .triggerHandler (), не всплывают в иерархии DOM; если они не обрабатываются целевым элементом напрямую,
  они ничего не делают.
• Вместо того, чтобы возвращать объект jQuery (чтобы разрешить цепочку), .triggerHandler () возвращает любое значение, которое было возвращено последним
  обработчик это вызвало быть выполненным. Если никакие обработчики не запущены, это
  возвращает неопределенное значение

Answer 2

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

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

изменение вашего кода для этого решит проблему:

$(document).ready(function(){
    $('#intervention1-form').change(function() {
        console.log('WHY DOESNT THIS HAPPEN?');
    });
    console.log("1");
    $('#selectid').triggerHandler('change');
    $('#selectid').trigger('change');
    $('#selectid').change();
    console.log("2");
});
console.log("0");

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