Javascript 制作一个滚动到下一个标题的跳过按钮

我想使用一个叫做“skiper”的类的按钮 然后单击该按钮将窗口滚动到下一个标题元素。我不想每次都写在我想写的地方

到目前为止，我试过：

$(document).ready(function () {
    $(".skiper").click(function () {
        $('body').scrollTop($(nextInDOM(this, $('h'))));
        event.preventDefault();
    });     
});  

我想这是完全错误的

---

我使用了两个插件：和。

您可以这样解决它：

$(document).ready(function () {
    var body = $('body');
    var headings = $('h1');
    var current = 0;

    $(".skipper").click(function (event) {
        ++current;

        if (headings.length > current) {
            body.animate( { scrollTop: headings.eq(current).position().top }, 200);
        }

        event.preventDefault();
    });
});

尝试演示：

---

您可以根据需要调整

标题的选择器。但是JavaScript不必在用户每次单击按钮时都重新查询。
使用以下代码：

$(document).ready(function () {
    $(".skiper").click(function (event) {
        $('html, body').scrollTop($(this).nextInDOM($('h1, h2, h3, h4, h5, h6')).position().top);
        event.preventDefault();
    });     
});  

|
您正在搜索下一个
DOM元素。如果它是一个css类，您应该使用
$（“.h”）
。。