任何問題hasClass

Question

的!$catalog.hasClass('catalog-fixed')在第6行的值始終爲true

$(window).scroll(function(){ 
 
     var $catalog = $(".catalog-brief"); 
 
     var sideTop = $catalog.offset().top; 
 
     if (sideTop < 1000){ 
 
      // always true 
 
      if (!$catalog.hasClass('catalog-fixed')) $catalog.addClass("catalog-fixed"); 
 
     } else { 
 
      if ($catalog.hasClass('catalog-fixed')) $catalog.removeClass("catalog-fixed"); 
 
    } 
 
})

但能正常工作

var $catalog = $(".catalog-brief"); 
 
var sideTop = $catalog.offset().top; 
 
$(window).scroll(function(){ 
 
     if (sideTop < 1000){ 
 
      if (!$catalog.hasClass('catalog-fixed')) $catalog.addClass("catalog-fixed"); 
 
     } else { 
 
      if ($catalog.hasClass('catalog-fixed')) $catalog.removeClass("catalog-fixed"); 
 
    } 
 
})

我犯了什麼錯誤？

Answer 1

你可以試試這個：

var $catalog = $(".catalog-brief"); 
    var sideTop = $catalog.offset().top; 
    $(window).scroll(function(){ 
     (sideTop < 1000) && ($catalog.toggleClass("catalog-fixed")) 
    }) 

參見：https://stackoverflow.com/a/11069385/1845408

Answer 2

嘗試使用window.scrollY而不是當前sideTop的。或者$(window).scrollTop()如果你想使用Jquery。

$(window).scroll(function(){ 
     var $catalog = $(".catalog-brief"); 

     // if ($(window).scrollTop() < 1000) { 
     if (window.scrollY < 1000) { 
      if (!$catalog.hasClass('catalog-fixed')) $catalog.addClass("catalog-fixed"); 

     } else { 
      if ($catalog.hasClass('catalog-fixed')) $catalog.removeClass("catalog-fixed"); 
    } 
});