Я новичок в JQuery. Я использую эту функцию JQuery, чтобы показать всплывающую подсказку по элементам.

Я отредактировал код в соответствии со своими потребностями (с помощью этого сообщества):

$(document).ready(function() {  
   $('.toolTipField').each(function() {
     $(this).tooltipster({
         content: $('<span>' + $(this).attr("data-tooltipText") + '</span>')
     });
   });
});

Мне нужно показать всплывающую подсказку также для элементов, добавленных в DOM с помощью этой функции JQuery:

$("#element").clone().appendTo("#target")

Теперь всплывающая подсказка не работает с элементами, добавленными в DOM с помощью JQuery. Заглянув в Интернет, я обнаружил, что мне нужно использовать метод on() вместо ready(), но я не знаю, как правильно редактировать свой код.

Спасибо всем.

1
MDP 11 Май 2016 в 16:30

3 ответа

Лучший ответ

Делегирование мероприятия не решит вашу проблему. Он не динамически определяет, когда элементы добавляются в документ. Вам нужно вручную вызвать код, чтобы добавить всплывающую подсказку. Лучше всего выделить код, чтобы его можно было использовать повторно, а затем вызывать метод при готовности и при клонировании элемента.

function addToolTips (elems) {
   elems.each(function() {
     $(this).tooltipster({
         content: $('<span>' + $(this).attr("data-tooltipText") + '</span>')
     });
   });
}


$(document).ready(function() {  
   addToolTips($('.toolTipField'))
});

И когда вы клонируете элемент

var clonedElem = $("#element").clone().appendTo("#target");
addToolTips(clonedElem);
4
epascarello 11 Май 2016 в 13:40
var myClone = $('el').clone(); 
myClone.appendTo('target'); 
myClone.tooltipster({....});
2
epascarello 11 Май 2016 в 13:41

JQuery предоставляет вам элементы, существующие в данный момент, а не те, которые вы добавляете позже. Если вы добавите их, вам также придется добавить всплывающую подсказку

-1
Mayday 11 Май 2016 в 13:38