Javascript JQuery滚动-停止上一个&；概括

我有这样的代码：

JavaScript

$( document ).ready(function() {
  $("a.link1").click(function (){
        //$(this).stop().preventDefault().animate(function(){
            $('html, body').animate({
                scrollTop: $("#link1").offset().top
            }, 2000);
        //});
  });

  $("a.link2").click(function (){
        //$(this).stop().preventDefault().animate(function(){
            $('html, body').animate({
                scrollTop: $("#link2").offset().top
            }, 2000);
        //});
  });

  $("a.link3").click(function (){
        //$(this).stop().preventDefault().animate(function(){
            $('html, body').animate({
                scrollTop: $("#link3").offset().top
            }, 2000);
        //});
  });
});

HTML正文：

<div id="menu">
  <a href='#link1' class="link1">LINK 1</a>
  <a href='#link2' class="link2">LINK 2</a>
  <a href='#link3' class="link3">LINK 3</a>
</div>
<div id="content">
  <a name="link1" id="link1"></a>
  <!--some text-->
  <a name="link2" id="link2"></a>
  <!--some text-->
  <a name="link3" id="link3"></a>
  <!--some text-->
</div>

请帮我做这个：

停止似乎没有按我想要的方式工作。当另一个链接激活时，我想以某种方式停止上一次滚动

是否有任何方法可以概括jQuery部分。我有3个以上的菜单链接，我不想为每一个做一个特殊的功能

非常感谢你的帮助。

---

Gomi

是的，只需泛化这样的函数，然后在函数内部查找调用者（如下所示）：

---

您可以通过将click回调提取到公共函数来进行概括：

var linkClickCallback = function(selector){
        $('html, body').stop().animate({
            scrollTop: $(selector).offset().top
        }, 2000);
}

$( document ).ready(function() {
   $("a.link1").click(linkClickCallback.bind(null, '#link1'));
   $("a.link2").click(linkClickCallback.bind(null, '#link2'));
   $("a.link3").click(linkClickCallback.bind(null, '#link3'));
});

请注意，在linkClickCallback中，我还编写了stop（）方法的正确用法

编辑：

这将适用于菜单中的所有项目：

$( document ).ready(function() {
   $("#menu a").click(function(e){
        e.preventDefault();
        linkClickCallback('#' + this.className);
   });
});

---

使用相同的linkClickCallback函数。

您可以在所有锚点上设置一个常规类，并为每个锚点设置一个id。然后您可以执行$（a.link）。单击（function（）{id=$（this）.attr（'id'）；并使用该id滚动顶部。}）；很有效，谢谢。我有两个问题：1）是否有任何方法可以将其更一般化（有些人认为像“for all links in#menu do..”）2）是否有任何方法可以添加

.preventDefault（）

？它更平滑（在执行滚动之前不会“闪烁到锚定”），我相应地更新了我的answear。如果这对你有用的话，你可以把我的帖子标记为公认的answear。嗯。。。我不知道为什么，但它不起作用。事实上，我的链接是

…

，但在我看来，应该没有区别（我也尝试过使用caller

#menu>ul>a

，但没有帮助）。

$( document ).ready(function() {
   $("#menu a").click(function(e){
        e.preventDefault();
        linkClickCallback('#' + this.className);
   });
});