Question

在我的应用程序中，我左侧有一个导航窗格，右侧窗格中有内容。当您单击导航窗格中的项目时，它将通过使用jQuery ajax将内容动态加载到内容窗格中。加载内容后，我将更新浏览器的URL。例如：

www.mysite.com/content.html#section1
www.mysite.com/content.html#section2
www.mysite.com/content.html#section3

在内容中，我希望具有指向同一内容中其他区域的链接，以便单击该内容时，内容会滚动到该区域。如果使用典型的锚标记，则浏览器的URL将得到更新，这是我要避免的。我可以使用点击处理程序和一些Javascript滚动到它。但是我想知道是否有一种方法可以在没有Javascript的情况下完成。

Answer 1

没有Java语言，您可以完成此操作吗？答案是否定的。

您需要使用自定义点击事件。

Answer 2

<!DOCTYPE html>
<html>
<head>
<style>
html {
  scroll-behavior: smooth;
}

#section1 {
  height: 600px;
  background-color: pink;
}

#section2 {
  height: 600px;
  background-color: yellow;
}
</style>
</head>
<body>

<h1>Smooth Scroll</h1>

<div class="main" id="section1">
  <h2>Section 1</h2>
  <p>Click on the link to see the "smooth" scrolling effect.</p>
  <a href="#section2">Click Me to Smooth Scroll to Section 2 Below</a>
  <p>Note: Remove the scroll-behavior property to remove smooth scrolling.</p>
</div>

<div class="main" id="section2">
  <h2>Section 2</h2>
  <a href="#section1">Click Me to Smooth Scroll to Section 1 Above</a>
</div>

</body>
</html>

PFB链接可能会有所帮助： https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_smooth_scroll

使用锚导航而不更改浏览器网址，也无需使用JavaScript

2 个答案: