jQuery只附加一次

所以我有这个：

jQuery("document").ready(function($){ var nav = $('#nav'); var logo = ''; $(window).scroll(function () { if ($(this).scrollTop() > 136) { nav.addClass("nav-f"); nav.append(logo); } else { nav.removeClass("nav-f"); nav.remove(logo); } }); }); 

滚动时我正在尝试修改导航，这有效，但我也想在#nav div中添加一个带有徽标图像的标签，这也适用但它会附加在每个滚动上，所以在滚动时我会变得像100个图像的徽标。

如何才能使其仅追加一次并且当滚动次数超过136px时才被删除？

Answer 1

只需使用布尔值，

 jQuery("document").ready(function($){ var nav = $('#nav'); var logo = ''; var visible = false; $(window).scroll(function () { if ($(this).scrollTop() > 136) { nav.addClass("nav-f"); if(!visible) { nav.append(logo); visible = true; } } else { nav.removeClass("nav-f"); if(visible) { $('#lilLogo').remove(); visible = false; } } }); }); 

小提琴

另一种方法是检查$('#lilLogoID').is(':visible') ，然而这会搜索img并在每个事件上检查可见（这会很慢）

Answer 2

 jQuery("document").ready(function($){ var nav = $('#nav'); var logo = ''; $(window).scroll(function () { if ($(this).scrollTop() > 136) { nav.addClass("nav-f"); if (!$(".nav-f").find('#lilLogo').length) { nav.append(logo); } } else { nav.removeClass("nav-f"); nav.remove(logo); } }); }); 

Answer 3

添加一个类说scroll到#nav 。 然后在$(window).scroll(function () {里面$(window).scroll(function () {检查是否#nav .hasClass()类scroll ，如果它有剩下的那么做，否则不要.. if删除了类， if删除类.removeClass()