jQuery不會向元素添加類

Question

簡單向下滾動->使用jQuery更改導航欄順序。

$(document).ready(function () {
    'use strict';
     var c, currentScrollTop = 0,
     navbar = $('nav');
     $(window).scroll(function () {

        currentScrollTop = a;
        if (c > 650) {
          navbar.addClass("scrollUp");
          console.log("Showing navbar", c, navbar.hasClass("scrollUp"));

        } else if (c < 700) {
          navbar.removeClass("scrollUp");
        }
        c = currentScrollTop;
    });
}

控制台日志在需要時輸出當前滾動條和“ false”。 上課沒有加起來。 Fyi我對jQuery很不好，這是我的react應用程序中唯一的東西。 CSS中的scrollUp向nav添加了背景顏色過渡，使其不透明。 我注意到有時可以正常工作，有時不能正常工作，而且我無法確定問題所在。 尚未看到它工作了一段時間。

獎金：

$("#toProjects").click(function() {
      $('html, body').animate({
          scrollTop: $("#projects").offset().top -75
      }, scrollSpeed);
      return false;
  });

這個scrollTo函數不能正常工作。

HTML：

<head>
<script language="javascript" src="./jquery.js"></script>
</head>

CSS：

.navbar.scrollUp {
  background-color: #000000;
  transform: background-color 0s ease 0s;
}

Answer 1

你設置currentScrollTop到a ，但a是從未定義。

編輯：我發現您在網站上的代碼與在此處發布的代碼不同。
您沒有正確連接到導航欄。 試試這個吧。

var c, currentScrollTop = 0, navbar = $('#navbar');

$('nav')正在尋找名稱為'nav'的元素，其中的頁面上不存在。 與調用$('div')或document.querySelector('div') 。

$('#navbar')頁面上id屬性設置為navbar的元素。

這解決了該類未添加的問題，但是我認為您需要使用css才能真正看到影響的發生。

Answer 2

通過將jQuery代碼直接集成到React組件內的ComponentDidMount（）函數中，解決了該問題。 這樣，它可以重新接合並正常工作

jQuery不會向元素添加類

問題描述

2 個解決方案

解決方案1
1 2019-04-29 19:59:57

解決方案2
0 2019-05-08 15:16:25

jQuery不會向元素添加類

問題描述

2 個解決方案

解決方案1 1 2019-04-29 19:59:57

解決方案2 0 2019-05-08 15:16:25

解決方案1
1 2019-04-29 19:59:57

解決方案2
0 2019-05-08 15:16:25