Зачем нужно событие change jQuery?

Question

[JackShcherbakov]

Зачем нужно событие change jQuery?

Comments

[bro-dev]

Если у вас такие вопросы, значит рановато jquery вам, для начало просто js и его взаимодействие с дом изучите.

Answer 1

[Юрий Есин]

Затем, что прежде чем изучать фреймворк к языку, сперва стоит изучить сам язык. В JavaScript есть ряд событий, таких как onclick, onsubmit, onload и тд, onchange среди них. Событие происходит, когда значение input, select или textarea меняется. В jQuery существуют методы-обёртки над этими событиями, которые можно удобно использовать. $(e).click() вызовет событие клика, а $(e).click(function () { }) повесит на событие onclick обработчик - коллбэк, переданный первым аргументом метода. Помимо этого, есть ещё метод on(), который позволяет прицепить обработчики сразу к ряду селекторов, например $(document).on("change", "input, select, textarea", function (e) { }).

Comments

[Дмитрий]

Метод on не специально для множественного селектора. Такой селектор можно и при простом bind() и при click() использовать. Метод .on для отслеживания появления новых элементов в dom

[Юрий Есин]

Дмитрий: Цитирую официальную документацию разработчиков:

Attach an event handler function for one or more events to the selected elements.

Пруф здесь.
Метод ничего не отслеживает, просто мы его на document вешаем, который в момент биндинга всегда актуален после динамического обновления. С таким же успехом метод on() можно прицепить к любому другому элементу, но поведение биндинга будет уже несколько иным.

[Дмитрий]

Юрий Есин: то, что вы написали и процитировали никак не идет в разрез с моими словами. Да, метод это реализует. Но его главное отличие от .bind() и .click() в том, что метод позволяет вешать события на элементы, которые появятся. Разве не так?

Answer 2

[Alexander Pushkarev]

Оно срабатывает при изменении. Например когда изменили текст в input и убрали курсор с поля, будет воспроизведено событие change

Comments

[JackShcherbakov]

Уже более понятно, в книге этого не объяснялось. А на практие где применимо?

[Alexander Pushkarev]

JackShcherbakov: например в валидации. Вот самый простой пример https://codepen.io/AXP/pen/prvdYW

[Дмитрий Еремин]

JackShcherbakov: количество товаров в корзине обновилось - нужно пересчитать итоговую стоимость