«Если рабочий хочет хорошо выполнять свою работу, он должен сначала заточить свои инструменты» — Конфуций, «Аналитики Конфуция. Лу Лингун»
титульная страница > программирование > Как прикрепить события Onclick к динамически добавляемым элементам с помощью jQuery?

Как прикрепить события Onclick к динамически добавляемым элементам с помощью jQuery?

Опубликовано 23 декабря 2024 г.
Просматривать:897

How to Attach Onclick Events to Dynamically Added Elements with jQuery?

Как привязать событие Onclick к динамически добавляемым элементам HTML с помощью jQuery

При работе с jQuery часто необходимо динамически добавлять элементы HTML в страница. В таких случаях вы можете захотеть прикрепить к этим элементам обработчики событий. Однако прикрепление обработчиков событий к элементам, добавленным после загрузки страницы, может оказаться сложной задачей.

Проблема и предыдущее решение

Традиционно для этого можно использовать метод .bind(). прикрепляйте обработчики событий к динамически добавляемым элементам. Однако этот метод устарел в пользу метода .on().

Правильное решение с помощью .on()

Чтобы правильно привязать событие onclick к элемент, динамически добавляемый с помощью jQuery, вам следует использовать метод .on() следующим образом:

$(document).on('click', '.my-element', function() {
  // Your event handling code goes here
});

В этом примере метод .on() используется для прикрепления обработчика событий к документу, указывая событие «click» и селектор «.my-element». Это гарантирует, что любой элемент с классом my-element вызовет обработчик событий независимо от того, когда он был добавлен на страницу.

Пример использования

Вот пример реализации метода .on():

В этом примере используется метод .on() чтобы прикрепить обработчик событий к любому элементу с классом my-element внутри #container div. При нажатии на любой такой элемент отображается предупреждающее сообщение.

Последний учебник Более>

Изучайте китайский

Отказ от ответственности: Все предоставленные ресурсы частично взяты из Интернета. В случае нарушения ваших авторских прав или других прав и интересов, пожалуйста, объясните подробные причины и предоставьте доказательства авторских прав или прав и интересов, а затем отправьте их по электронной почте: [email protected]. Мы сделаем это за вас как можно скорее.

Copyright© 2022 湘ICP备2022001581号-3