Показать всплывающую подсказку jQuery?

Question

Я хочу использовать функцию подсказки jQuery UI, но мне это нужно, поэтому, когда вы нажимаете элемент (в моем случае изображение), подсказка инструмента остается открытой. Это можно сделать? Я не видел никаких вариантов для этого.

http://api.jqueryui.com/tooltip/

UPDATE вот мой код. Я думал, что четвёртая линия должна работать, но к сожалению, нет:

HTML

<img class="jqToolTip" src="/query.gif" title="Text for tool tip here"> 

Javascript

$('.jqToolTip').tooltip({ 
    disabled: false  
}).click(function(){  
    $(this).tooltip("open"); 
// alert('click'); 
}).hover(function(){ 
    // alert('mouse in'); 
}, function(){ 
    // alert('mouse out'); 
}); 

Answer 1

Я пытался решить ту же самую точную проблему, и Я не мог найти ответ нигде. Наконец, я придумал решение, которое работает после 4 часов поиска и экспериментов.

То, что я сделал это:

1. Остановлено распространение сразу, если состояние была нажата
2. Добавлен обработчик щелчка для отслеживания состояния

//This is a naive solution that only handles one tooltip at a time 
 
//You should really move clicked as a data attribute of the element in question 
 
var clicked; 
 
var tooltips = $('a[title]').on('mouseleave focusout mouseover focusin', function(event) { 
 
    if (clicked) { 
 
    event.stopImmediatePropagation(); 
 
    } 
 
}).tooltip().click(function() { 
 
    var $this = $(this); 
 
    var isOpen = $this.data('tooltip'); 
 
    var method = isOpen ? 'close' : 'open'; 
 
    $this.tooltip(method); 
 
    //verbosity for clarity sake, yes you could just use !isOpen or clicked = (method === 'open') 
 
    if (method === 'open') { 
 
    clicked = true; 
 
    } else { 
 
    clicked = false; 
 
    } 
 
    $this.data('tooltip', !isOpen); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script> 
 
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/themes/redmond/jquery-ui.css" rel="stylesheet" /> 
 
<a href="#" title="That's what this widget is">Tooltips</a>

Надеюсь, это поможет будущему слизи gler.

отчасти благодаря this post

Answer 2

http://api.jqueryui.com/tooltip/#method-open

$('img.my-class').click(function() { 
    $(this).tooltip("open"); 
}