jquery - qtip2 在移动设备上禁用

Question

我正在寻找一种在移动设备上查看我的网站时禁用 qtip2 工具提示的方法。在桌面浏览器中，工具提示出现在悬停时，在移动设备上，当触摸文本输入时，它们会弹出(这是大多数工具提示通过 title=""绑定(bind)的)。我只能通过触摸其他地方来让它消失，而且我怀疑最终用户会在被它惹恼之前弄清楚这一点。

查看 API，并在 SO 处搜索，我遇到的几个解决方案对我来说不起作用。这是我尝试过的:

$('[title!=""]').qtip({// Grab elements with a title attribute that isn't blank.
        style: 'qtip-tipsy',
        position: {
             target: 'mouse', // Track the mouse as the positioning target
             adjust: { x: 5, y: 15 } // Offset it slightly from under the mouse
        }
    }); 

//check window size on page load. 
    if ($(window).width() < 960) {
    alert('Less than 960');
    //$('[title!=""]').qtip('hide').qtip('disable');
    $('[title!=""]').qtip('destroy', true); // Immediately destroy all tooltips belonging to the selected elements
}
else {
   //alert('More than 960');
}
});

在测试时，当我将浏览器设置为小于 960 并刷新时，警报就会触发，因此它似乎可以正确读取该代码。我尝试了在 craigsworks.com 论坛上读过的两种方法，第一个是使用隐藏和禁用(当前在上面的示例中注释掉，而我尝试下一个)，第二个是使用“销毁”我还尝试直接在“position”的最后一个大括号之后和结尾之前添加窗口大小代码 });

然后我尝试直接访问 api，但我真的不知道我是否正确执行了操作，而且我找不到任何包含所有所需代码的示例。这是我尝试过的:

   var tooltips = $('[title!=""]').qtip({// Grab elements with a title attribute that isn't blank.
    style: 'qtip-tipsy',
    position: {
               target: 'mouse', // Track the mouse as the positioning target
               adjust: { x: -5, y: -15 } // Offset it slightly from under the mouse
          }
   }); 
    // Grab the first element in the tooltips array and access it's qTip API
    var api = tooltips.qtip('api'); 
    //check window size on page load. 
        if ($(window).width() < 960) {
        alert('Less than 960');

    $tooltips.qtip('destroy', true); // Immediately destroy all tooltips belonging to the selected elements
}
else {
   //alert('More than 960');
}
});

过去几天我一直在研究这个问题(并且仍然有其他领域我无法工作，例如用按钮打开/关闭工具提示，但我专注于一件事一次)。我希望你们中一些更擅长编码的人能够看到我哪里出错了。

Answer 1

当移动设备似乎无法正常工作时，我最终使用此代码仅加载部分 qtip 代码。借自If mobile disable certain scripts

<script type="text/javascript">
$(document).ready(function() {
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
}else
{
$('[title!=""]').qtip({
     position: {
         target: 'mouse', // Track the mouse as the positioning target
         adjust: { x: 5, y: 5 } // Offset it slightly from under the mouse
     }
 })
}
});
</script>

显然，您可以在其中进行任何 qtip 设置，但通过从页面中删除它们，它只会将我的 qtip 区域变成链接而不是工具提示。这就是我想要的。您可以使用此代码禁用/启用移动到桌面的任何 JavaScript。