工具提示在 Safari 上无法正常工作/iPad

Question

我尝试了不同形式的工具提示，它们在 Chrome 或浏览器、android 等中都工作正常。

但是当涉及到 iPad、iPhone 和 safari（有时甚至是 chrome）时，我发现按钮上的工具提示突然需要点击 2 次才能按下按钮.单击一次显示工具提示，然后单击按钮。

<button href="#mail-wrapper" 
        class="book-button book-text-button col-std-mail" 
        ng-click="vm.mailButton=true;" 
        uib-popover="Send Mail to Tenant" 
        popover-trigger="'mouseenter'">
        <md-icon class="material-icons book-material" aria-label="Mail" role="img">mail</md-icon>
        MAIL
</button>

有没有人对 angular、jquery、js 的工具提示组件有建议，它适用于 safari / iOS？`

Answer 1

我看到相同的行为，在 links 上使用 bootstrap4 和工具提示。

<script>$(function () {$('[data-toggle="tooltip"]').tooltip()})</script>
<a href="mylink" data-toggle="tooltip" data-placement="bottom" title="my tooltip text">my link or icon</a>

结果：点击 1 仅触发工具提示。未遵循 link。需要第二次点击才能触发 link。

别问我为什么，我终于"solved"使用了这个配置：

将下面的CSSclass添加到我的linkcursor:pointer
向工具提示调用添加一些配置：trigger:"hover" 和 delay:{"show":400,"hide":800}

完整的解决方案是

<script>$(function () {
    $('[data-toggle="tooltip"]').tooltip({trigger:"hover",
                                          delay:{"show":400,"hide":800}})})</script>
<a href="mylink" class="perso-IOSpointer" data-toggle="tooltip" data-placement="bottom" title="my  tooltip text">my link or icon</i></a>

我尝试更改延迟，这是我在多款 iPhone 上的观察结果

无延迟：需要轻按 2 次
"show":100：需要点击 2 次
"show":300：需要点击 1 次

我最后设置成400ms，好像没问题。

工具提示在 Safari 上无法正常工作/iPad

Tooltips not working as expected on Safari / iPad

javascript

jquery

tooltip