javascript - jQuery UI 工具提示在鼠标移开时不会关闭 div

Question

问题

当我将鼠标悬停在 jQuery 工具提示上时，它会不断在名为 ui-helper-hidden-accessible 的元素中创建新的子 div，我曾尝试关闭该元素，但是一些 div 的样式为 display: none，而另一些则实际显示在页面底部。

• 我目前使用的是 jQuery UI 1.12.1

脚本.js

$(document).tooltip({
        tooltipClass: "popup",
        items: ".fa-question-circle",
        position: {
        my: "center bottom-15",
        at: "center top",
        collision: 'none',
        close: function(event, ui) {
            $(".ui-helper-hidden-accessible").remove();
        },
    },
    hide: false
});

index.html

<p class="score__title">Student-teacher ratio <i class="fa fa-question-circle tooltip" title="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed aliquam gravida molestie. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla facilisi. Cras tempor nisi ac ligula molestie commodo. Sed varius magna at justo rutrum, et faucibus sapien cursus." aria-hidden="true"></i></p>

Answer 1

我在您的代码中发现了一些语法错误。清理并测试后，它似乎可以工作。

示例:https://jsfiddle.net/Twisty/17sj6Lj5/

HTML

<h1>
Widget
</h1>
<hr />
<div>
  <p class="score__title">Student-teacher ratio <i class="ui-icon ui-icon-help fa fa-question-circle tooltip" title="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed aliquam gravida molestie. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla facilisi. Cras tempor nisi ac ligula molestie commodo. Sed varius magna at justo rutrum, et faucibus sapien cursus."
    aria-hidden="true"></i></p>
</div>

CSS

.fa-question-circle {
  background-color: #000;
  border-radius: 50%;
}

.ui-icon {
  background-image: url(http://download.jqueryui.com/themeroller/images/ui-icons_ffffff_256x240.png)
}

JavaScript

$(function() {
  $(document).tooltip({
    tooltipClass: "popup",
    items: ".fa-question-circle",
    position: {
      my: "center bottom-15",
      at: "center top",
      collision: "none"
    },
    close: function(event, ui) {
      $(".ui-helper-hidden-accessible").remove();
    },
    hide: false
  });
});

您没有正确平仓头寸。这意味着 close 和 hide 未被读取。