Javascript滚动到div id [关闭]答案

【问题标题】：Javascript scroll to div id [closed]Javascript滚动到div id [关闭]
【发布时间】：2014-08-01 05:30:29
【问题描述】：

我在 google 上搜索了我的问题的解决方案，但我不明白为什么我编写的代码适用于所有人，但不适用于我。

我写了这个：

<head>
    <meta charset="utf-8" />
    <title></title>
    <script type="text/javascript">
        function scrollTo() {
            $('html, body').animate({ scrollTop: $('#div_id').offset().top }, 'slow');
            return false;
        }
    </script>
    <style type="text/css">
        .uno {
            height: 1000px;
            background: #808080;
        }
        .due {
            margin-top: 300px;
            height: 500px;
            background: #ff00ff;
        }
    </style>
</head>
<body>
    <div class="uno" onclick="scrollTo()"> 
        Clicca
    </div>
    <div class="due" id="div_id"></div>
</body>

【问题讨论】：

你是否包含了 jquery 库
为什么不在 SO 上发布之前检查控制台？ :)

标签： javascript jquery html css scroll

【解决方案1】：

<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script type="text/javascript">
        function scrollTo() {
            $('html, body').animate({ scrollTop: $('#div_id').offset().top }, 'slow');
            return false;
        }
    </script>
    <style type="text/css">
        .uno {
            height: 1000px;
            background: #808080;
        }
        .due {
            margin-top: 300px;
            height: 500px;
            background: #ff00ff;
        }
    </style>
</head>
    <body>
        <div class="uno" onclick="scrollTo()"> 
        Clicca
        </div>
        <div class="due" id="div_id"></div>
    </body>
</html>

试试这个：

【讨论】：

请在上面的代码中包含 jquery 库后试试这个是否有效
是的，我是个彻头彻尾的白痴……我试图制作一个不包含 jquery 的 jquery 脚本。天哪……
@Daniele hahahha，有时会发生这种情况
@DanieleNekoLuciani：如果建议的解决方案解决了您的问题，请接受此作为答案。这也可能对其他人有所帮助。
@SyncCircles 感谢同步

【解决方案2】：

将您的脚本更改为：

$('.uno').on('click', function(){
    $('html, body').animate({scrollTop: $("#div_id").offset().top}, 'slow');
});

并从第一个 div 中删除 onclick。

演示在this jsFiddle。

【讨论】：

【解决方案3】：

看我的 jsfiddle：

您应该将 jquery 添加到您的代码中，这是我的方式：

JSFIDDLE

在jsfiddle 中，如果您单击每个 div，您将滚动到其他 div DEMO

Javascript

$("#firstDiv").click(function(){
        $('html, body').animate({ scrollTop: $('#div_id').offset().top }, 'slow');

 })

HTML

<div class="uno" id="firstDiv"> 
    Clicca
</div>
<div class="due" id="div_id"></div>

【讨论】：