Как привязать всплывающие подсказки Twitter Bootstrap к динамически создаваемым элементам?
Я использую всплывающие подсказки начальной загрузки Twitter с javascript следующим образом:
$('a[rel=tooltip]').tooltip();
Моя разметка выглядит так:
<a rel="tooltip" title="Not implemented" class="btn"><i class="icon-file"></i></a>
Это работает нормально, но я добавляю элементы динамически, а всплывающие подсказки не не отображается для этих динамических элементов. Я знаю, это потому, что я привязываю .tooltip() только один раз, когда документ загружается с типичной функциональностью jquery $(document).ready(function().
Как я могу привязать это к динамическому созданные элементы? Обычно я делаю это с помощью метода jquery live(). Однако какое событие я использую для привязки? Я просто не уверен, как подключить bootstrap .tooltip() с jquery .live()
Я нашел один способ заставить это работать примерно так:
/* Add new 'rows' when plus sign is clicked */
$("a.add").live('click', function () {
var clicked_li = $(this).parent('li');
var clone = clicked_li.clone();
clone.find(':input').each(function() {
$(this).val('');
});
clicked_li.after(clone);
$('a[rel=tooltip]').tooltip();
});
Это работает, но выглядит довольно хакерским. Я также вызываю точно такую же строку .tooltip() в $(ready) вызов. Итак, элементы, которые существуют при первой загрузке страницы и соответствуют этому селектору, дважды попадают во всплывающую подсказку?
Я не вижу проблем с этим подходом. Я просто ищу передовой опыт или понимание поведения.