Как связать функцию с элементом?

Question

Я использую JQuery плагин miniTip: http://goldfirestudios.com/blog/81/miniTip-jQuery-Plugin

Он работает со следующим кодом:

$('#primary').on('hover', function() { 

    $('.tooltip').miniTip({ 
     offset:30 
    }) 
}); 

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

Answer 1

Плагин не «перестает работать», просто не знает о недавно добавленных элементах. Учитывая, что ваш соответствующий код срабатывает внутри события зависания на #primary, я должен предположить, что элемент с id="primary" загружен динамически, в противном случае должен все еще работал.

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

например.

$(document).on('hover', '#primary', function() { 

    $('.tooltip').miniTip({ 
     offset:30 
    }) 
}); 

Делегированные события делегируют ответственность за обработку события перед своим предком. Предки прислушиваются к этому событию (например, hover), пузырящимся из элемента потомка, , затем применяет фильтр jQuery. Функция затем применяется к любому соответствующему элементу-потомку, который вызвал событие.

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

Примечания:

• Всегда используйте document по умолчанию, если не удобно предок не ближе. 'body' имеет ошибку, относящуюся к стилизации (если у нее есть , вычисленная высота 0, она не получит событий мыши вообще!).
• Если это не работает для вас, вы должны предоставить остальную часть кода, как эта проблема может быть что-то не связаны (ID Дубликат элемента, ошибка загрузки кода и т.д.)