Question

我正在使用jquery tipsy工具提示来显示其他信息。我现在使我的网站响应，所以我添加了一个resize事件监听器，并根据页面的大小显示或多或少的元素。因此，我必须重新应用醉意的工具提示。例如，我现在可能有新的元素，但还没有任何醉意。

不幸的是，似乎每次重新申请后我都没有替换现有的tipsys，但又添加了另一个。

请查看jsfiddle的效果。调整html结果窗格的大小后，您可以在显示工具提示时在javascript控制台中看到多个回调。

Html代码：

<body>
    <a href="xy">xxx</a>
</body>

Javascript代码：

var i = 0;

function addTipsy(event) {
    $('a').tipsy({
        title: function() {
            i = i + 1;
            console.log('mouseenter ' + i);
            return 'test';
        }
    });
};

addTipsy();

window.addEventListener('resize', addTipsy);

Answer 1

在重新应用tipsy处理程序之前取消绑定mouseenter和mouseleave似乎有效：

var i=0;

function addTipsy(event) {
    $("a").unbind('mouseenter mouseleave');
    $('a').tipsy({
       title: function() {
            i = i + 1;
            console.log('mouseenter ' + i);
            return 'test';
        }
    });
};

addTipsy();

window.addEventListener('resize', addTipsy);

另一种方法是通过添加类来记住那些已经具有醉意处理程序的元素，并且只将漏洞处理程序添加到那些没有该类的元素：

function addTipsy(event) {
    $('a').not(".tipsyApplied").addClass("tipsyApplied").tipsy({
        title: function() {
            i = i + 1;
            console.log('mouseenter ' + i);
            return 'test';
        }
    });
};

如何重新应用jquery tipsy到现有元素

1 个答案: