JavaScript 在 Chrome 中工作,而不是在 Firefox 中

JavaScript works in Chrome not in Firefox

本文关键字:Firefox 工作 Chrome JavaScript      更新时间:2023-09-26

我有一个导航栏,可以在Chrome(41.0.2272.89)中工作,但在Firefox(36.0.1)中不起作用。

.HTML

    <div class="collapse navbar-collapse" id="navbar">
      <ul class="nav navbar-nav">
        <li  class="active"><a class="navBtn" onclick="scrollTo(home)" title="#home">Home</a></li>
        <li><a class="navBtn" onclick="scrollTo(about)" title="#about">About</a></li>
        <li><a class="navBtn" onclick="scrollTo(clients)" title="#clients">Clients</a></li>
        <li><a class="navBtn" onclick="scrollTo(portfolio)" title="#portfolio">Portfolio</a></li>
        <li><a class="navBtn" onclick="scrollTo(contact)" title="#contact">Contact</a></li>
      </ul>
    </div><!-- /.navbar-collapse -->

使用简单的点击,它将激活我的 JS

.JS

function scrollTo(element) {
if(element == document.getElementById('home')) {
    $('html, body').animate({
        scrollTop: $(element).offset().top - 54
    }, 500);
} else {
    $('html, body').animate({
        scrollTop: $(element).offset().top - 53 
    }, 500);
}}

似乎JS在Chrome中激活,但在Firefox中没有激活。

应该发生的是,当您单击某个项目时,网站将向下滚动到该项目。这曾经工作正常,但现在它突然现在更长了。

示例在这里

scrollTo 必须是保留字,因为它们自己的 Window.scrollTo() 函数。

function moveTo(element) {
if(element == document.getElementById("home")) {
    $("html, body").animate({
        scrollTop: $(element).offset().top - 54
    }, 500);
} else {
    $("html, body").animate({
        scrollTop: $(element).offset().top - 53 
    }, 500);
}}

因此,更改函数名称会返回正常功能。

在我看来,

您的点击定义是错误的。

而不是:

<li><a class="navBtn" onclick="scrollTo(about)" title="#about">About</a></li>

尝试在 DIV 名称两边使用单引号,例如:

<li><a class="navBtn" onclick="scrollTo('about')" title="#about">About</a></li>

这也需要对函数代码进行一些调整,以处理传递 DIV 的名称而不是对象。