0

我正在使用 tooltipster 插件来创建工具提示。

当工具提示出现时,如果您点击背景(粉红色) - 它会提醒您 IDdata-post-id='xx'已关闭(functionAfter)。它显示正确的 ID。

但是,如果您单击任何其他提示,而不是单击背景(粉红色),则会显示错误的 ID。是什么导致了这种情况以及如何解决?

见演示:http: //jsfiddle.net/ww60y38h/

$(".tip").tooltipster({
        content: 'Loading...',
        contentAsHTML: true,
        offsetY: -13,
        autoClose: true,
        theme: 'tooltipster-punk',
        trigger: "click",
        onlyOne: true,
        multiple: false,
        interactive: true,
        functionBefore: function(origin, continueTooltip) {
            continueTooltip();
            postID = $(this).data('post-id');
            origin.tooltipster('content', "Post ID: " + postID);
        },
        functionAfter: function(origin) {
            alert("PostID Tooltip Closed:" + postID);
        }

});

HTML:

<div style="height: 900px; background-color:pink">
  <div class="tip" data-post-id='1'>ToolTip PostID 1</div>
  <div class="tip" data-post-id='2'>ToolTip PostID 2</div>
  <div class="tip" data-post-id='3'>ToolTip PostID 3</div>
</div>
4

1 回答 1

1

不要postID对所有工具提示使用单个全局变量,每次打开工具提示时都会覆盖它。将var关键字 beforepostID放在 functionBefore 中,并在 functionAfter 中以相同的方式定义。

于 2015-07-09T10:03:02.273 回答