JQuery несколько подсказок

Question

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

пример работы можно найти на http://titan.maxko.org/?page=search&item=tier, когда вы наведете значок GROUP, он покажет изображения, чем снова наведите курсор на любое изображение, и это будет работать, но проблема в том, что он конвертирует html-теги, как это было сделано при первом наведении. Короче подсказка внутри tooltip dosen't конвертирует html-теги.

мой код:

<script> 
     $(function() { 
      $.widget("ui.tooltip", $.ui.tooltip, { 
       options: { 
        content: function() { 
         return $(this).prop('title'); 
        } 
       } 
      }); 

      $("[title]") 
      .bind("mouseleave", function(event) { 

       var test = $(this).attr('class'); 
       if(test != "group") 
        return; 

       event.stopImmediatePropagation(); 

       var fixed = setTimeout('$("[title]").tooltip("close")', 50); 

       $(".ui-tooltip").hover(
        function(){clearTimeout (fixed);}, 
        function(){$("[title]").tooltip("close");} 
       ); 
      }).tooltip(); 

     }); 
</script> 

Спасибо заранее.

Answer 1

Ну, похоже, ваш вызов имеет разные аспекты. Я бы просто сказал, что вы можете проверить документацию на https://api.jqueryui.com/1.9/tooltip/

Сначала вам не нужно использовать stopPropagation и tooltip.close() в вашем сценарии.

Попробуйте следующее: Используйте поставляемые события, такие как tooltipclose и аналогичные. Инициализация обработчиков инициализацией плагина через его объект конфигурации.

Вы, как правило, не нужно использовать тайм-аут, используйте

$(".selector").tooltip({ 
    hide: { effect: "explode", duration: 1000 } 
}); 

и

$(".selector").tooltip({ 
    show: { effect: "blind", duration: 800 } 
}); 

, чтобы плагин обрабатывать FADEOUT или аналогичный.

Вы можете изменить привязку по умолчанию к элементу [title] элемента к любому селектору, в котором вы нуждаетесь. Например. для вновь созданных элементов.

$(".selector").tooltip({ 
    items: "img[alt]" 
}); 

Для того, чтобы связать обработчик динамически созданных элементов DOM, использовать

jQuery.on() 

метод. См. http://api.jquery.com/on/, так как bind() не будет работать для этого.

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

Использование

$(this) 

обратиться к текущему элементу внутри обработчиков.