Append и события

@Dias606 · Регистрация: 20.09.2016

Студворк — интернет-сервис помощи студентам

После вставки данных через append на страницу, не работают события для этих элементов

JavaScript
1
2
$('.headsearch').on('keyup change', function () {
$('#ordersave').on('click', function () {

Как победить ?

@Fart83 · 20.07.2018, 09:23

если информация от вас "исчерпывающая", то только дебажить.

@Dias606 · 20.07.2018, 09:37 **[ТС]**

т.е. все должно работать ?

@j2FunOnly · 20.07.2018, 10:32

Сообщение от Dias606

После вставки данных через append на страницу, не работают события для этих элементов

Каждый день задаются эти вопросы, хотя это же основы http://api.jquery.com/on/

Direct and delegated event handlers

Event handlers are bound only to the currently selected elements; they must exist at the time your code makes the call to .on(). To ensure the elements are present and can be selected, place scripts after the elements in the HTML markup or perform event binding inside a document ready handler. Alternatively, use delegated events to attach event handlers.

Delegated event handlers have the advantage that they can process events from descendant elements that are added to the document at a later time.

Обработчики событий могут быть назначены только тем элементам, которые уже присутствуют на странице.
Например, таким образом:

JavaScript
1
2
3
$( "#dataTable tbody tr" ).on( "click", function() {
  console.log( $( this ).text() );
});

Клик будет отрабатывать только на тех строках таблицы, которые уже существовали на странице. На динамически сформированные строки этой таблицы этот обработчик не среагирует на клик.

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

JavaScript
1
2
3
$( "#dataTable tbody" ).on( "click", "tr", function() {
  console.log( $( this ).text() );
});

В вашем случае

JavaScript
1
$(document).on('keyup change', '.headsearch', function () {

Но лучше не весь документ, а на ближайший родительский элемент будущих элементов назначать обработчик.

Новые блоги и статьи Все статьи Все блоги /
Воспроизведение звукового файла с помощью SDL3_mixer при касании экрана Android 8Observer8 26.01.2026 Содержание блога SDL3_mixer - это библиотека я для воспроизведения аудио. В отличие от инструкции по добавлению текста код по проигрыванию звука уже содержится в шаблоне примера. Нужно только. . .	Установка Android SDK, NDK, JDK, CMake и т.д. 8Observer8 25.01.2026 Содержание блога Перейдите по ссылке: https:/ / developer. android. com/ studio и в самом низу страницы кликните по архиву "commandlinetools-win-xxxxxx_latest. zip" Извлеките архив и вы увидите. . .	Вывод текста со шрифтом TTF на Android с помощью библиотеки SDL3_ttf 8Observer8 25.01.2026 Содержание блога Если у вас не установлены Android SDK, NDK, JDK, и т. д. то сделайте это по следующей инструкции: Установка Android SDK, NDK, JDK, CMake и т. д. Сборка примера Скачайте. . .	Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly 8Observer8 24.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
моя боль iceja 24.01.2026 Выложила интерполяцию кубическими сплайнами www. iceja. net REST сервисы временно не работают, только через Web. Написала за 56 рабочих часов этот сайт с нуля. При помощи perplexity. ai PRO , при. . .	Модель сукцессии микоризы anaschu 24.01.2026 Решили писать научную статью с неким РОманом	http://iceja.net/ математические сервисы iceja 20.01.2026 Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .	http://iceja.net/ сервер решения полиномов iceja 18.01.2026 Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .

@Fart83 321 / 189 / 78 Регистрация: 04.10.2016 Сообщений: 809
	20.07.2018, 09:23
	если информация от вас "исчерпывающая", то только дебажить. 0

@Dias606 72 / 61 / 24 Регистрация: 20.09.2016 Сообщений: 559
	20.07.2018, 09:37 [ТС]
	т.е. все должно работать ? 0

Append и события

Решение