javascript - 更改智能表中的页面会阻止 JQuery 函数工作？

Question

很抱歉，如果这是在其他地方或显而易见的。我搜索后没有看到它，而且我对网络开发非常陌生，所以我可能有点在这儿绕圈子。

详细信息:

我正在使用智能表扩展 ( http://lorenzofox3.github.io/smart-table-website/ ) 在我正在构建的 Tomcat Web 应用程序上显示数据。一切都运行良好，但我遇到了一些工具提示功能的问题。我已经编写了代码，以便 x/y 坐标将跟随鼠标，并且如果图标没有悬停在其上，它将离开屏幕，因此不会干扰任何内容。为了实现这一点，我有一个带有 span 元素的 div，其中包含我需要的文本。例如，

<td st-ratio="60">
     <div class="smartToolTip">
          Here<span class="smartToolTipText">{{row.hover}}</span>
     </div>
</td>

问题:

这在智能表中运行良好，直到我更改页面。之后，如果我将鼠标悬停在将显示工具提示跨度的任何位置，它就会将其显示出来。不再使用鼠标坐标来更新位置。我可以没有这种跟随鼠标的功能，但这显然是一个问题，因为在一个大的工具提示中，跨度占用了大量的屏幕空间(看看它如何妨碍下面我的 Plunker 中的分页 div)。

在我看来，切换页面后，tooltip.js 中的所有内容都会失败。这段代码有什么我不知道的吗？

$(document).ready(function() {

    $('.smartToolTip').hover(function(){
    }, function() {

            // Hover out code
            $('.smartToolTipText').css({ top: -3000})

    }).mousemove(function(e) {

            var mousex = e.pageX - 30;
            var mousey = e.pageY + 8;

        if (mousex<0) {
            mousex = 2;
        }

            $('.smartToolTipText')
            .css({ top: mousey, left: mousex })
    });

});

骗子: https://plnkr.co/edit/0Eakvt5Cb3hjyZF2t7ad

注意:我确实注意到这个 Plunker 由于某种原因无法在 Firefox 中运行。我的网络应用程序可以，所以不用担心修复这个问题。如果您使用的是 Firefox，并且想要访问该链接，请切换到其他浏览器。

感谢任何和所有建议/答案，如果有任何我可以澄清的地方，请告诉我。在这里第一次发帖，试图遵循礼仪，但可能遗漏了一些东西。提前致谢。

编辑:解决方案:

这里的每条评论:

Changing pages in smart-table stops JQuery functions from working?

遵循建议将函数绑定(bind)到 mouseout 和 mousemove 事件，而不是文档就绪。这就是我所需要的一切。

Answer 1

这里的每条评论:

Changing pages in smart-table stops JQuery functions from working?

遵循建议将函数绑定(bind)到 mouseout 和 mousemove 事件，而不是文档就绪。这就是我所需要的一切。