出于某种原因，我在这个网站上使用的回到顶部按钮我编码完全没有工作。当我隐藏按钮时，它不会再出现，所以我然后让它可见，看它是否会起作用，但它仍然无法做任何事情。除了导致它的jquery代码之外，不确定它是否是其余的代码。我在其他地方使用了回到顶部的btn代码，它工作得很好，也使用了chrome dev工具，没有弹出错误。任何帮助，将不胜感激！
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Improved Dentistry Site 2</title>
<link href="https://fonts.googleapis.com/css?family=Josefin+Sans" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Encode+Sans+Condensed:500" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Raleway:200,300,400,700,900" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Rajdhani:300,400" rel="stylesheet">
<!-- bootstrap -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<!-- owl carousel -->
<link rel="stylesheet" href="css/owl.carousel.min.css">
<link rel="stylesheet" href="css/owl.theme.default.min.css">
<!-- animate css -->
<link rel="stylesheet" href="css/animate-raw.css">
<!-- fontawesome -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.8/css/all.css" integrity="sha384-3AB7yXWz4OeoZcPbieVW64vVXEwADiYyAEhwilzWsLw+9FgqpyjjStpPnpBO8o8S" crossorigin="anonymous">
<link rel="stylesheet" href="css/dentri-css.css">
<link rel="stylesheet" href="css/dentri-respon.css">
</head>
<body id="dent-body" data-spy="scroll" data-target=".fixed-top" data-offset="65">
<header id="top"><!--************** START OF THE HEADER HERE ************************-->
<div class="info-nav">
<div class="info-con container">
<div class="row">
<div class="col-md-6">
<div class="appt-box">
<a href="#"><p><i class="fas fa-calendar-alt"></i> | <small>Request Appt</small></p></a>
</div><!-- end of appt box -->
<div class="dropdown appt-box">
<a href="#" class="" type="" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><p><i class="fas fa-clock"></i> | <small>Office Hours</small></p></a>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<table class="hours-table table">
<thead>
<tr>
<th scope="col"><small class="bold-small">Day</small></th>
<th scope="col"><small class="bold-small">Hours</small></th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row"><small>Mon - Fri</small></th>
<td><small>8 a.m - 6 p.m</small></td>
</tr>
<tr>
<th scope="row"><small>Sat</small></th>
<td><small>8 a.m - 4 p.m</small></td>
</tr>
<tr>
<th scope="row"><small>Sun</small></th>
<td><small>8 a.m - 2 p.m</small></td>
</tr>
</tbody>
</table>
</div>
</div><!-- end of appt box -->
</div>
<div id="wats" class="col-md-6 text-right">
<i class="ws-i fab fa-whatsapp-square"> <span class="ws-num"> +1 (914) 646-8467 </span></i>
</div>
</div><!-- end of row -->
</div>
</div><!-- end of info nav div -->
<nav class="nav navbar navbar-expand-lg custom-bar-color fixed-top">
<a class="navbar-brand" href="http://jcdevelops.com/work1/primeDental.html"><img src="img/PRIMELOGO-only-one.png" class="brand-logo"></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<i class="nav-i fas fa-align-justify"></i>
</button>
<div class="collapse navbar-collapse dent-menu" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto sti-ul">
<li class="nav-item">
<a class=" nav-link scroll" href="http://jcdevelops.com/work1/primeDental.html">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link scroll active-a" href="http://jcdevelops.com/work1/about.html" role="button">
About
</a>
</li>
<li class="nav-item">
<a class="nav-link scroll" href="http://jcdevelops.com/work1/team.html">Our Team</a>
</li>
<li class="nav-item dropdown">
<!-- add dropdown-toggle if you want the arrow down when using dropdown menu -->
<a class="nav-link scroll dropdown-toggle" href="" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Services
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="http://jcdevelops.com/work1/cosmeticc.html">Cosmetic</a>
<a class="dropdown-item" href="http://jcdevelops.com/work1/preventativee.html">Preventative</a>
<a class="dropdown-item" href="http://jcdevelops.com/work1/restorativee.html">Restorative</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="">Other Services</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link scroll" href="http://jcdevelops.com/work1/testimon.html">Testimonials</a>
</li>
<li class="nav-item">
<a class="nav-link scroll" href="http://jcdevelops.com/work1/contactt.html">Contact</a>
</li>
</ul>
</div><!-- end of collapse menu -->
</nav>
</header><!--************** END OF THE HEADER HERE ************************-->
<section id="about-dent"><!--===================== START OF SECTION =====================-->
<div class="cont-wrap">
<div class="about-contains mx-auto">
<h2 class="team-h3">About Prime Dental</h2><p class="h-small-p">more about us</p>
<div class="content-title-underline">
</div><!-- end of content underline -->
<br>
<img class="" src="img/SU-Design-1524775505.jpg">
<p class="h-small-head">Our humble beginnings</p>
<p class="">Prime Dental is here to assist you in achieving the best smile possible, with high-end equipment, the latest in training and skilled dental practitioners who love what they do. We are a qualified, friendly team, bringing excellence in dentistry to <a href="" class="about-link">Canterbury</a> and surrounds. But I must explain to you how all this mistaken idea of denouncing pleasure and praising pain was born and I will give you a complete account of the system, and expound the actual teachings of the great explorer of the truth, the master-builder of human happiness.</p>
<h5 class="h-states">Our Mission</h5>
<p>On the other hand, we denounce with righteous indignation and dislike men who are so beguiled and demoralized by the charms of pleasure of the moment, so blinded by desire, that they cannot foresee the pain and trouble that are bound to ensue; and equal blame belongs to those who fail in their duty through weakness of will, which is the same as saying through shrinking from toil and pain. </p>
<h5 class="h-states">Our Vision</h5>
<p>On the other hand, we denounce with righteous indignation and dislike men who are so beguiled and demoralized by the charms of pleasure of the moment, so blinded by desire, that they cannot foresee the pain and trouble that are bound to ensue; and equal blame belongs to those who fail in their duty through weakness of will, which is the same as saying through shrinking from toil and pain. </p>
<hr class="about-hr">
<div class="cont-contact mx-auto">
<h3 class="abu">Top Rated Dentistry Care</h3>
<p class="cos">On the other hand, we denounce with righteous indignation and dislike men who are so beguiled and demoralized by the charms of pleasure of the moment, so blinded by desire, that they cannot foresee the pain and trouble that are bound to ensue; and equal blame belongs to those who fail in their duty through weakness of will, which is the same as saying through shrinking from toil and pain.</p>
<a href="http://jcdevelops.com/work1/contactt.html" class="btn btn-cont-contact">Consult</a>
</div>
</div>
</div>
<a href="#top" class="back-to-top"><i class="fas fa-caret-up"></i></a>
</section><!--===================== END OF SECTION =====================-->
</body>
<footer>
<div class="footer-bottom text-center">
<a href="http://jcdevelops.com/" target=”_blank” class="jcdev-anchor"><small>Developer : </small> <img src="img/JCdev(blackBACK).png" class="jcdev">
</a>
<a href="" class="sitemap">|<p><small> Sitemap</small></p></a>
<br>
<span class="footer-num"><a href=""><small>Tel: +1 (914) 646-8467</small></a></span>
<br>
<p class="footer-p"><span class="copyright-span">Copyright © 2018</span> <b>PRIME DENTAL</b></p>
<span class="separate">|</span>
<a href="" class="footer-icons"><i class="fab fa-facebook-square"></i></a>
<a href="" class="footer-icons"><i class="fab fa-instagram"></i></a>
</div>
</footer>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/waypoints/4.0.1/jquery.waypoints.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="js/dent.js"></script>
<script>
/*====================================================*/
/*============== TESTIMONIALS/CLIENTS ================*/
/*===================================================*/
$(document).ready(function(){
$(window).scroll(function(){
if($(window).scrollTop()> 400){
$('a.back-to-top').fadeIn('fast');
}else{
$('a.back-to-top').fadeOut('slow');
}
});
$('a.back-to-top').click(function(){
$('html, body').animate({
scrollTop:0
}, 'fast');
return false;
});
});
</script>
</html>
答案 0 :(得分：0)
首先，我认为您的问题只是由于您在页脚标记之前关闭了body标记。
所以首先尝试将</body>放在</html>
然后在处理
之前将preventdefault()函数添加到您的jquery代码中
$(document).ready(function(){
$(window).scroll(function(){
if($(window).scrollTop()> 400){
$('a.back-to-top').fadeIn('fast');
}else{
$('a.back-to-top').fadeOut('slow');
}
});
$('a.back-to-top').click(function(e){
e.preventDefault();
$('html, body').animate({
scrollTop:0
}, 'fast');
return false;
});
});