jquery窗口调整大小函数只触发一次，而不是每次调整大小时触发

我正在尝试设置一个jquery函数来检查窗口宽度，以便导航栏正常工作。我想做的是：如果屏幕宽度大于949px，启动一个功能，使鼠标悬停在一个下拉锚链接上，打开一个下拉子菜单；如果屏幕宽度小于或等于该949px，请删除该功能，以便必须单击.dropdown锚链接才能打开下拉子菜单（默认情况下，单击下拉链接时会打开它们-我认为这是一个引导组件）

我根据stackoverflow上的一些类似示例创建了一些函数，但发现该函数仅在屏幕宽度超过949px时触发，因此在较小的宽度下，下拉锚仍然通过悬停打开子菜单，这是我不想要的

var width = $(window).width();
$(window).resize(function(){
  if($(this).width()>949){
    $(".dropdown").hover(function(){
      $(this).addClass("open");
    },
    function(){
      $(this).removeClass("open");
    });
  }
});

---

如何改进此功能，以便在949px以上的宽度处添加.dropdown hover功能，并在949px及以下的宽度处删除该功能？

可能并不完美，因为jquery不是我的强项，但它可以完成以下任务：

var width = $(window).width();
$(window).resize(function(){
  if($(this).width()>949){
    $(".dropdown").on({
        mouseenter: function () {
            $(this).addClass("open");
        },
        mouseleave: function () {
            $(this).removeClass("open");
        }
    });
  }
  else{
    $(".dropdown").off("mouseenter");
    $(".dropdown").off("mouseleave");
  }
});

---

请注意，此实现还将删除.dropdown元素上的任何其他现有mouseenter和mouseleave事件处理程序。

可能并不完美，因为jquery不是我的强项，但它可以完成以下任务：

var width = $(window).width();
$(window).resize(function(){
  if($(this).width()>949){
    $(".dropdown").on({
        mouseenter: function () {
            $(this).addClass("open");
        },
        mouseleave: function () {
            $(this).removeClass("open");
        }
    });
  }
  else{
    $(".dropdown").off("mouseenter");
    $(".dropdown").off("mouseleave");
  }
});

---

请注意，此实现还将删除.dropdown元素上的任何其他现有mouseenter和mouseleave事件处理程序。

在执行任何操作之前，只需建立事件绑定并检查大小，而不是添加和删除绑定：

$(".dropdown").hover(function() {
    if ($(window).width() > 949) {
        $(this).addClass("open");
    }
}, function() {
    if ($(window).width() > 949) {
        $(this).removeClass("open");
    }
});

如果添加和删除事件处理程序，则需要防止执行两次（例如，它们将大小调整为980，然后再调整为1050）

var hover\u added=false；
$（窗口）。调整大小（函数（）{
var width=$（this.width（）；
如果（宽度>949&！添加悬停）{
$（“.dropdown”）。在({
鼠标指针：函数（）{
$（此）.addClass（“打开”）；
},
mouseleave:function（）{
$（此）.removeClass（“打开”）；
}
});
hover_added=true；
}否则，如果（width不添加和删除绑定，只需建立事件绑定并在执行任何操作之前检查大小：

$(".dropdown").hover(function() {
    if ($(window).width() > 949) {
        $(this).addClass("open");
    }
}, function() {
    if ($(window).width() > 949) {
        $(this).removeClass("open");
    }
});

如果添加和删除事件处理程序，则需要防止执行两次（例如，它们将大小调整为980，然后再调整为1050）

var hover\u added=false；
$（窗口）。调整大小（函数（）{
var width=$（this.width（）；
如果（宽度>949&！添加悬停）{
$（“.dropdown”）。在({
鼠标指针：函数（）{
$（此）.addClass（“打开”）；
},
mouseleave:function（）{
$（此）.removeClass（“打开”）；
}
});
hover_added=true；
}否则，如果（宽度我的建议是（为了避免同一事件绑定更多次）：


var-width=$（窗口）.width（）；
$（窗口）.on（'resize'，函数（e）{
多雷西泽（e）；
});
函数doResize（e）{
如果（$（this）.width（）>949）{
var isOpenOnHover=$（'.dropdown toggle'）.data（'isOpenOnHover'）；
if（等苯环）{
返回；
}
$（'.dropdown toggle'）.data（'isOpenOnHover'，true）；
$（'.dropdown toggle'）。悬停（函数（）{
$（'.dropdown toggle'）.trigger（'click.bs.dropdown'）；
});
}否则{
$（'.dropdown toggle'）.data（'isOpenOnHover'，false）；
$（'.dropdown toggle'）.off（'mouseenter mouseleave'）；
}
}
$（函数（）{
$（'.dropdown toggle'）.data（'isOpenOnHover'，false）；
doResize（）；
})；





我的建议是（为了避免在同一事件中绑定更多次）：


var-width=$（窗口）.width（）；
$（窗口）.on（'resize'，函数（e）{
多雷西泽（e）；
});
函数doResize（e）{
如果（$（this）.width（）>949）{
var isOpenOnHover=$（'.dropdown toggle'）.data（'isOpenOnHover'）；
if（等苯环）{
返回；
}
$（'.dropdown toggle'）.data（'isOpenOnHover'，true）；
$（'.dropdown toggle'）。悬停（函数（）{
$（'.dropdown toggle'）.trigger（'click.bs.dropdown'）；
});
}否则{
$（'.dropdown toggle'）.data（'isOpenOnHover'，false）；
$（'.dropdown toggle'）.off（'mouseenter mouseleave'）；
}
}
$（函数（）{
$（'.dropdown toggle'）.data（'isOpenOnHover'，false）；
doResize（）；
})；





只想确定：var a-b；这是语法正确还是拼写错误？我看到当大小大于949时，您将悬停事件添加到.dropdown框中，但您不想在大小减小后删除该侦听器吗？我不太习惯jquery方式，但我确定它具有删除事件侦听器的功能：take a lo好的，在on（）和off（）嘿-你是对的，这是一个已经编辑过的打字错误。我不完全确定如何根据你的建议修改我的脚本…我的想法是这两个函数（添加悬停或删除悬停）都依赖于“on”更改事件。只是想确定：var a-b；这是语法正确的还是仅仅是一个输入错误？我看到您在大小大于949时将悬停事件添加到.dropdown框中，但您不想在大小小于949时删除该侦听器吗？我不太习惯jquery方式，但我确定它具有删除事件侦听器的功能：t看看on（）和off（）嘿-你是对的，这是一个已经编辑过的打字错误。我不完全确定如何根据你的建议修改我的脚本…我的想法是这两个函数（添加悬停或删除悬停）都依赖于“on”更改事件。感谢您的回复。elfwyn。这似乎工作得更好，我将看看是否可以在此基础上进行构建。以Barmars代码为例，因为它可以防止开销，并且比我的解决方案更精确。感谢您的回复