javascript - 我的导航栏不会固定 - JS 代码不起作用

Question

这是错误:

Uncaught TypeError: Cannot set property 'innerHTML' of null

是的，我知道以前有人问过这个问题。

我已经阅读了所有类似的问题，试图为自己找到解决方案，但没有任何帮助。

前面问题的解决方案:

1. 您有一个元素具有该 ID - 检查
2. 元素在运行 Javascript 之前就在页面上 - 检查
3. 您将 JS 的执行绑定(bind)到元素出现在页面上之后发生的事件(之前的后续事件)- 检查(这意味着 JS 发生在用户完成某些操作之后，对吗？)<
4. 我尝试在 body 标签内(末尾)和 body 标签外添加 .JS 文件，但都没有效果。

这些是我在问题中看到的所有解决方案(我以我目前的知识理解)并且能够应用于我的代码。我可能由于缺乏知识而忽略了一个解决方案(但只是因为我不理解它)。

我似乎找不到解决方案。当我手动将固定 header 添加到#main-navigation 时，它工作正常，但 JS 错误阻止它通过 JS 代码工作。

如果有帮助，网址是http://desimara.com

这是我的 script.js 文件:

var $window = $(window);
var $nav = $('#main-navigation');
$window.scroll(function(){
    if ($window.scrollTop() >= 119) {
      $nav.addClass('fixed-header');
    }
    else {
      $nav.removeClass('fixed-header');
    }
});

var quotes = [
  "This guy knows what hes doing, huge vouch for him since he created a kickass site for me.<br><br><br><br>- Tappo Masa (peketus.lakutus@gmail.com)",
  "Huge vouch for this guy! Created a very nice looking website for me! This is a great service, especially because it is free. Highly recommend using this guy for small websites to be created. Thanks once again!<br><br>- Andrew Kilian (sacepk@gmail.com)"
];

var counter = 0;
$pID = "quoteText";

setInterval(function () {
if (counter < quotes.length) {
    document.getElementById($pID).innerHTML = quotes[counter];
    counter++;
  }
  else {
    counter = 0;
  }
}, 4000);

这是带有#main-navigation 的 HTML:

<nav id="main-nagivation">
        <ul>
          <a href="portfolio.php" id="portfolio" class="navigation"><li>Portfolio</li></a>
          <a href="about.php" class="navigation"><li>About</li></a>
          <a href="free.php" class="navigation"><li>Free Stuff</li></a>
          <a href="donate.php" class="navigation"><li>Donate</li></a>
        </ul>
      </nav>

这是包含 JS 文件的 HTML:

</body>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://arrow.scrolltotop.com/arrow30.js"></script>
<noscript>Not seeing a <a href="http://www.scrolltotop.com/">Scroll to Top Button</a>? Go to our FAQ page for more info.</noscript>
    <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<script type="text/javascript" src="script.js"></script>
    <script src="http://code.jquery.com/jquery.js"></script>
</html>

Answer 1

您在 HTML 文件中的 ID 有错字。 “主要民族给予”。

(抱歉没有足够的积分评论:()