我目前正在尝试在窗口宽度小于700px时禁用脚本。
我看过其他帖子上的建议,但到目前为止还没有任何工作。
window.onresize = function () {
if(window.innerWidth < 700) {
$(window).bind('scroll', function() {
if ($(window).scrollTop() > 100) {
$('#projectinfo').hide();
} else {
$('#projectinfo').show();
}
});
}
}
最佳答案
问题在于,一旦将事件处理程序附加到窗口,就永远不会解除绑定。我建议您也不要在每次window.resize
事件触发时都绑定滚动事件处理程序,因为这是非常昂贵的事件性能。同样,您将重新绑定一个已经存在的处理程序,如果它可以工作的话,仍然是非常糟糕的做法。
您可能真正想要的是决定document.ready是否附加滚动处理程序。如果调整大小的用例确实相关(网络用户通常在查看特定页面时通常不会调整浏览器窗口的大小,这只是Web前端开发人员一直在检查其工作的响应性),请首先测试您的滚动处理程序是否当前附加到window
,并且仅添加未添加的(&&)您的window.innerWidth >= 700
。否则,再次检查滚动处理程序是否存在,并取消绑定(如果存在)和window.innerWidth < 700
。
http://api.jquery.com/unbind/
另外,请注意,可以在声明绑定时使用event.name
语法为绑定命名事件。在此处的jQuery文档中找到此内容:
使用命名空间
与其维护对处理程序的引用以解除它们的绑定,
我们可以为事件命名空间并使用此功能来缩小
我们解除约束的行动的范围。如讨论中所示
.bind()
方法,使用句点(.
)定义名称空间
绑定处理程序时的字符:
$("#foo").bind("click.myEvents", handler );
当以这种方式绑定处理程序时,我们仍然可以按常规方式将其解除绑定:
$("#foo").unbind("click");
但是,如果我们想避免影响其他处理程序,则可以更加具体:
$("#foo").unbind("click.myEvent");
我们也可以取消绑定命名空间中的所有处理程序,而不管事件类型如何:
$("#foo").unbind(".myEvent");
在开发插件或开发工具时,将名称空间附加到事件绑定上特别有用。
否则编写可能与其他事件处理交互的代码
将来的代码。