单击图像链接时如何显示工具提示

Question

单击时有一个图标，我希望它显示工具提示

<a class="toolclick"  href="#" ><i class="icon-ellipsis-vertical"></i></a>

脚本

<script>
    $( document ).ready( function() {
        $( '.toolclick' ).tooltip( {title: "Hooray!", trigger: "click"} ); 
    } );
</script>

单击该图标不会显示工具提示

Answer 1

  

HTML代码：

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

  

jQuery代码：

   $('#tt').on({
  "click": function() {
    $(this).tooltip({ items: "#tt", content: "Displaying on click"});
    $(this).tooltip("open");
  },
  "mouseout": function() {      
     $(this).tooltip("disable");   
  }
});

尝试一下。

Answer 2

这是当鼠标悬停在元素上时显示工具提示的一种连击方式。

如果要在悬停事件上显示工具提示，请尝试以下代码。

<div class='toolclick'>
    Here you can write your tooltip content
</div>

$('.icon-ellipsis-vertical').hover(function(){
    $('.toolclick').tooltip({title: "Hooray!", trigger: "click"}); 
});

点击显示工具提示。

$('.icon-ellipsis-vertical').click(function(){
    $('.toolclick').tooltip({title: "Hooray!", trigger: "click"}); 
});