jQuery UI工具提示进行修改以进行单击仅打开并关闭一次

Question

jQuery：1.8.2
jQuery UI：1.9.1

我修改了实现jQuery UI工具提示的默认方法，以便在单击而不是悬停方式上使用。

" A"标签是您单击以激活工具提示的东西，但并未定义为工具提示。工具提示＆amp;工具提示内容是在" A"标签之后放置的，并用CSS隐藏，因此您不能徘徊或查看内容。

<a class="tooltip-click" id="tt3">asdf</a><span class="tooltip-tick" title="">&nbsp;</span>
<div class="tooltip-content">3</div>

在工具提示实现中，我使用"内容："属性来获取工具提示定义旁边的DIV的内容，而不是使用"标题"

我在工具提示定义中还具有一个功能，如果您单击工具提示内容，可以关闭工具提示。

$('.tooltip-tick').tooltip({
        position: { 
            my: "left+15 center", 
            at: "right center",
            using: function( position, feedback ) {
                        $( this ).css( position );
                        //function to close tooltip when content is touched                            
                        $('.ui-tooltip-content').click(function(){
                            $(".tooltip-tick").tooltip("close");
                        });   
        }},
        //the content of the div next to the tooltip instead of using title
        content: function(){
            return $(this).next().html();
        }   
    });

单击A标签时，它首先关闭任何打开的工具提示，然后打开Neccessary One：

$('.tooltip-click').click(function () {
        //first i close open tooltips
        if($(".ui-tooltip").length) $(".tooltip-tick").tooltip("close");
        //then open the tooltip next to the a tag                
        $($(this).next('.tooltip-tick')).tooltip('open');
    });

一切都起作用，但只有一次。http://jsfiddle.net/js8g6/

Answer 1

在关闭工具提示之后，尝试设置" .tooltip-tick"的标题 - 属性：

$(".tooltip-tick").attr("title", "");

打开工具提示需要标题，但是关闭后将以某种方式将其删除。

这只是一些工作;）

Answer 2

这是我找到的最好的解决方案。额外的好处是抑制默认的悬停标题。

    $(".help").tooltip({ 
         position: { 
             my: "left-1 top+20", at: "right top" 
         },  
         open: function( event, ui ) {
            $('.ui-tooltip').hide();
            $('.help').click(function() {
                   $('.ui-tooltip').fadeIn();
           });
        }
    });