Jquery Tools Tooltip not going away

I have a tool tip that will appear over anything with a title:

$("[title!=]:not(IFRAME)").tooltip();

I have a list of people that can be Added or Removed, you click a remove button that is positioned over the person, you click it to swap out that person for another person.

When you go to click the Remove button the Tool tip shows up, because that item has a . But once you swap that person out, the开发者_如何转开发 tooltip will not go away.

I am pretty sure the reason is that once that person is removed you don't have a mouseout, so the tooltip never goes away.

I tried this:

$('.remove-player-large a').click(function() {
  $("[title!=]:not(IFRAME)").tooltip().hide();
});

But no luck Any suggestions on how to fix this?

Does this makes sense ?

You can hide tooltip using hideTooltip() function.

var $tooltip = null;
$(function(){
    $tooltip = $("input[type='text']").tooltip({
        // place tooltip on the right edge
        position: "center right",
        // a little tweaking of the position
        offset: [-2, 10],
        // use the built-in fadeIn/fadeOut effect
        effect: "fade",
        // custom opacity setting
        opacity: 0.6
    });
    $("#close").click(function(){
        hideTooltip();
    });
});
function hideTooltip()
{
    if($tooltip)
    {
        $tooltip.each(function(index){
            var $this = $(this).data('tooltip');
            if($this.isShown(true))
                $this.hide();
        });
    }
}

jqueryUi tooltip has problem with ipad , tool-tip does not disappear if we click anywhere on the page so this simple solution worked for me and working on ios 6 , ios 7 , ios 8 devices

 $("#selector ").tooltip( "close" );

you can use these method

remove the tooltip element along with the link.

$('.remove-player-large a').click(function() {
  $('.tooltip').remove();//remove the tool tip element
});

if you don't know the class name of the tooltip element, you will need to use firebug to inspect, or you can find it in the tooltip source code

I was having this same problem and as I see there's not a valid solution here, the correct answer to the question posed above is to use the JQuery tools api to obtain the correct tooltip element and remove it before removing the owner of the tooltip.

var t = $('#object_to_remove').data('tooltip');
if(t) t = t.getTip();
if(t) t.remove();
$('#object_to_remove').remove();

The if(t) pieces are necessary so that this won't error if a tooltip either isn't attached or hasn't yet been called.

Since they are lazily added to the DOM t.getTip may return undefined (this means the tooltip data is still residing in the title attribute and so there is no cleanup to do since it will be removed with the owning DOM element).

I think the cleanest way is to call this command:

$("#your-element").tooltip('destroy');

In short, it removes your current tooltip functionality and #your-element comes back to normal state.

This is a official document: https://api.jqueryui.com/tooltip/#method-destroy

Just before you remove the person, send it the .mouseout() event. That will trigger the tooltip's normal mouseout behavior and should hide the tooltip (if it truly goes away on mouseout)

The somewhat related issue of jqueryui tooltips and iPads is answered elegantly here