如何在触摸屏智能手机上隐藏气球工具提示？

Question

我是JavaScript的新手。我使用搜索来找到问题的解决方案，但我无法找到我想要的内容。

我正在使用this jquery.balloon.js ，它将工具提示的默认浏览器呈现转换为自定义的（向其中添加一些CSS - 背景，边框等）。 ）。

这是JavaScript代码：

$(document).ready(function(){
 $('a').balloon({ 
  position: "bottom",
  tipSize: "0"
 });
});

一切正常：当我将鼠标悬停在包含title属性的链接上时，工具提示会显示自定义。当我将鼠标悬停在鼠标上时，工具提示会隐藏。

在触摸屏设备上浏览时出现问题。

没有鼠标悬停，所以我点击一下链接，气球工具提示显示（链接没有激活，链接仅在我点击两次时激活），但工具提示不会隐藏。我轻拍身体某处，但工具提示仍保留在屏幕上。

我知道如何通过点击/点击它们（在html或body中）$('html').click(function() { //code });来隐藏JavaScript中的元素，但这里的问题是工具提示不是元素，但属性......

如何通过点击身体某处隐藏工具提示？

您可以使用任何触摸屏设备在 jquery.balloon.js 网站here上测试此行为，以便查看通过点击工具提示激活后无法隐藏。< / p>

Answer 1

感谢唯一的答案，但我明白了。

我使用以下代码创建了class：

$.balloon.defaults.classname = ".balloon";
$.balloon.defaults.css = null;

这样我创建了.balloon类，允许我自己定制工具提示。我使用此代码通过隐藏.balloon（隐藏新定制的jQuery工具提示）来隐藏工具提示：

$(document).ready( function(){
    $('body').click( function(event){
        event.stopPropagation();
        $('.balloon').hide();
    });
});

Answer 2

您可以调用hideBalloon函数。