Question

我想使用Tooltipster插件点击正文中的元素来显示工具提示，我想在工具提示中有一个关闭按钮来关闭它。

但是我使用Jquery click（）函数来处理它但它不会被触发。我在这篇文章中尝试了解决方案。它仅在悬停事件触发工具提示时才起作用。

Tooltipster plugin not firing jquery function when link in in the tooltip is clicked

使用悬停在jsfiddle中的原始解决方案

trigger: 'hover',

而是使用点击显示工具提示

trigger: 'click',

http://jsfiddle.net/bCqyL/7/

它不会在jquery块中触发任何click事件。它只能通过普通的javascript函数捕获。我检查了它应该是Tooltipster插件中的一些代码锁定并在单击触发模式下捕获提示内的所有“click（）”事件。

在原始解决方案中使用代码时，我尝试了其他事件，例如onchange事件的单选按钮被触发

Answer 1

@Evan是对的。您的工具提示在DOM中不存在，您无法将任何操作绑定/委托给它（即使您在DOMReady之后一直回到$(document)）。

如果您正在使用工具提示中的关闭按钮后尝试以下代码，那么它对我有用（和JSFiddle！）：

的JavaScript

$('.tooltip').tooltipster({
    // Required, but have a fiddle around
    'interactive': true,
    'contentAsHTML': true,
    'autoClose': true,
    'trigger': 'click',
    'onlyOne': true,

    // ...

    // The coup de grâce ...
    'functionReady': function(){
        $('.tooltipster-default .close').on('click', function(e){
            e.preventDefault();
            $('body').click();
        });
    }
});

HTML

<span class="tooltip" title="<h3>Title <a title='Close' href='#' class='close'></a></h3><p>This is my tooltip content!">I have a tooltip!</span>

JSFiddle

http://jsfiddle.net/hpKST/1/

为什么会起作用

autoClose和trigger的组合有助于在用户点击交互式工具提示外时关闭工具提示。 functionReady回调允许您绑定一个函数以利用此功能并委托一个函数在Tooltipster打开时单击body，从而关闭工具提示。

我希望这有帮助！：）

Answer 2

这是因为当您尝试绑定函数时，DOM中不存在HTML。将内容作为jQuery对象插入，然后对其进行绑定。

编辑：我的回答是错误的，因为用户有一个委托的处理程序，我错过了。我在这里给出正确答案：https://github.com/iamceege/tooltipster/issues/145

当按钮或任何单击发生时，Tooltipster插件不会触发jquery功能

2 个答案:

的JavaScript

HTML

JSFiddle

为什么会起作用