jquery - 单击点后如何显示工具提示？

Question

我有代码(jquery ui):

.arrow{
    background-color: red;
}

$(function () {
        $(document).tooltip({
            position: {
                my: "center top+20",
                at: "center"
            },
            content: function () {
                return $(this).prop('title');
            }
        });
    });




<div class="item-point" data-top="130" data-left="300"  id="point1">
<div><a href="#" class="toggle tooltips"title="sample text <b>yes!!</b>" data-placement="top"></div>

我希望工具提示在单击该点后显示它，而不是在悬停后显示。

怎么做？

Answer 1

HTML代码:

<div id="tt">Test</div>

JS代码:

  var id = "#tt";
var $elem = $(id);

$elem.on("mouseenter", function (e) {
    e.stopImmediatePropagation();
});

$elem.tooltip({ items: id, content: "Displaying on click"});

$elem.on("click", function (e) {

    $elem.tooltip("open");
});

试试这个代码，它会在点击时显示你的工具提示，并会一直停留在那里，直到你点击退出。这是适合您的工作代码。 Onclick tooltip