Функция jquery к элементу, который добавляется?

Question

Я пытаюсь добавить кое-что html, и мне было интересно, почему, когда я пытаюсь написать какую-то функцию jquery, этот добавленный элемент не будет работать?

Например, если яу меня был список текста, и когда вы нажимаете на что-то, этот список будет заполнен каким-то .append («больше текста») для этого списка.Тогда, если я напишу некоторую функцию jquery, говорящую при наведении на этот текст, это не сработает.Он будет работать только с текстом, который уже был заполнен до добавления.

Надеюсь, мой пример прояснит мой вопрос?

Спасибо за помощь!

Answer 1

Вы, вероятно, привязываете свои обработчики, используя .click(), .hover() и т. Д. Они работают только для элементов, уже находящихся на странице в то время, когда обработчик связан.Это связывает элементы, которые соответствуют сейчас, и любые элементы, которые соответствуют, которые добавляются позже.

например

$('li').live('click', function() {
    // do stuff here
});

Answer 2

используйте метод live() в jQuery вместо обычного обработчика событий.Например:

$('#myelement > *').live('mouseenter', function(evt) {
    $(this).addClass('hovered');
}).live('mouseleave', function(evt) {
    $(this).removeClass('hovered');
})

теперь, когда вы сделаете это

$('#myelement').append( '<div>More Stuff</div>' );

, новый добавленный div получит события mouseenter и mouseleave, как вы хотели.