我想做的基本上是，我有一个带有徽标的导航栏。
单击ID为#theMenu的特定链接时，应将“ moveMainLogo”类添加到徽标图像中，并将“ open”类添加到带有“ navContainer”类的div中。
但是，如果用户完全向下滚动，我想立即添加“ moveMainLogo”类，然后如果单击#theMenu，那么唯一发生的就是将.open类添加到具有“ navContainer”类的div中。
然后，如果用户滚动回到页面顶部，则当单击#theMenu时，它将还原为原始行为，或者添加和删除这两个类。
所以我想我实际上是在尝试这样做...
IF（到顶部的距离大于0）
将A类应用于元素A
单击元素B时，将B类应用于元素B
其他
单击元素B时，将B类应用于元素B，并将A类应用于元素A
这是我到目前为止尝试过的代码，可以按照我的意愿进行工作，问题是它似乎不仅在用户滚动的距离大于0时而且在用户每次滚动任意量时切换类无论它们在页面上的何处。
window.onscroll = function() {myFunction()};
function myFunction() {
if (document.body.scrollTop > 0 || document.documentElement.scrollTop > 0) {
$(".mainLogo").toggleClass("moveMainLogo");
$("#theMenu").click(function () {
$("#animateMenu").toggleClass("hamburger-slim-clicked");
$(".navContainer").toggleClass("open");
});
} else {
$("#theMenu").click(function () {
$("#animateMenu").toggleClass("hamburger-slim-clicked");
$(".navContainer").toggleClass("open");
});
$("#theMenu").click(function () {
$(".mainLogo").toggleClass("moveMainLogo");
});
}
}
编辑：
小提琴：https://jsfiddle.net/2h3x0uam/1/
在用户滚动之前，如果他们单击菜单，则应该应用movemainlogo类。
如果他们关闭菜单，则应删除movemainLogo类。
如果滚动，则应使用movemainmenu类。
如果他们在滚动后打开菜单，则应保持使用movemainlogo类。
如果它们滚动回到顶部，则应删除movemainlogo类。
最佳答案
您不应在scroll事件中设置所有这些事件。在那里，您仅添加“ IF（到顶部的距离大于0）将A类应用于元素A”部分。
其余的您必须添加到document.ready或其他内容：
$(window).on("scroll", function() {
if (document.body.scrollTop > 0 || document.documentElement.scrollTop > 0) {
$("#ElementA").addClass("classA");
}
else {
$("#ElementA").removeClass("classA");
}
});
$("#ElementB").on("click", function() {
$(this).addClass("classB");
$("#ElementA").addClass("classA");
});
Demo。
希望我做对了，查看演示。
Final result here。