jQuery函数在不应该运行时运行

我有一个应该在

$（文档）上运行的函数。就绪
和
$（窗口）。调整大小
。当页面宽度>767px时，它被设置为不加载。但是，当页面大小调整为小于767px或从767px或更小开始，然后调整为大于767px时，出于某种原因，类
活动悬停仍应用于悬停。你知道为什么吗

function portfolioResizeHover() {
  var screenWidth = $(document).width();

  if (screenWidth <= 767) {
    $('.portfolio-display-box').hover(function () {
      // remove Class if there is an element with class already applied
      $('.active-hover').removeClass('active-hover');
      // Apply your class to this
      $(this).addClass('active-hover');
    });
  } else {
    $('.portfolio-display-box').removeClass('active-hover');
  }
}
$(document).ready(portfolioResizeHover);
$(window).resize(portfolioResizeHover);

函数portfolioResizeHover（）{
var screenWidth=$（文档）.width（）；
if（screenWidth）只需按照说明操作：在DOMReady/Resize上，浏览器运行
portfolioResizeHover（）
。该函数检查宽度。如果767删除类
活动悬停
-但不删除事件处理程序（！）；）好，我可以通过添加
$（'.portfolio display box'）来修复它。解除绑定（'mouseenter mouseleave'））；
转到else语句，删除事件处理程序。感谢您的帮助！当窗口更改其大小时，
调整大小
事件将被多次调用。这意味着您的函数将添加多个
悬停
事件处理程序！