Tooltipster插件不触发jquery功能时,按钮或任何点击甚至发生

Tooltipster plugin not firing jquery function when button or any click even occur

本文关键字:任何点 按钮 插件 jquery Tooltipster 功能      更新时间:2023-09-26

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

然而,我使用Jquery的click()函数来处理它,但它不会被触发。我在这篇文章中尝试了解决方案。它只在工具提示被悬停事件触发时起作用。

Tooltipster插件不触发jquery函数当链接在工具提示点击

在jsfiddle

中使用悬停的原始解决方案
trigger: 'hover',

使用click来显示工具提示

trigger: 'click',
http://jsfiddle.net/bCqyL/7/

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

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

@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/

为什么它工作

autoClosetrigger的组合有助于关闭工具提示每当一个人点击交互式工具提示之外。functionReady回调允许您绑定一个函数来利用这一点,并委托一个函数在工具提示器打开时单击body,从而关闭工具提示。

我希望这对你有帮助!:)

这是因为当您尝试绑定函数时,DOM中不存在HTML。将您的内容插入jQuery对象,并在其上进行绑定。

Edit:我的答案是错误的,因为用户有一个委托处理程序,我错过了。我给出了正确的答案:https://github.com/iamceege/tooltipster/issues/145