jquery: 错误 $ ("div#created").scrollintoview 不是函数

标签 jquery html css ruby-on-rails-3

编辑:新错误:错误 Jquery 未定义行:208

此代码中的第 208 行:https://github.com/litera/jquery-scrollintoview/blob/master/jquery.scrollintoview.js

enter image description here

我不确定为什么会收到此错误,因为我在 jsfiddle 中使一切正常工作,但是当我将代码添加到我的 Rails 应用程序时它不会工作。当我单击错误以了解更多信息时,complete: function() { 部分会突出显示。

单击链接会导致隐藏的 div 出现并且链接变为“事件”(颜色:红色),但是,窗口不会滚动到 div 的底部,当我单击链接以切换所有内容时,什么也没有发生(div 没有关闭并且链接保持红色)。

工作正常的原始 jsfiddle:http://jsfiddle.net/Gr7BP/

应用程序.js

$(function() {

    $("#created").hide();

    $('a.created-button').click(function() {

        $('#created').toggle(function() {
            $('a.created-button').toggleClass('active');
            $('#created').scrollintoview({
                duration: "slow",
                direction: "y", 
                complete: function() {
                        // highlight the element so user's focus gets where it needs to be
                }
            });
        });
    });
});

$(function() {

    $("#stuff").hide();

    $('a.stuff-button').click(function() {

        $('#stuff').toggle(function() {
            $('a.stuff-button').toggleClass('active');
            $('#stuff').scrollintoview({
                duration: "slow",
                direction: "y",
                complete: function() {
                        // highlight the element so user's focus gets where it needs to be
                }
            });
        });
    });
});

页脚

<footer>
 <div id="created-by"><a class="created-button">Created by</a></div> 
 <div id="cool-stuff"><a class="stuff-button">Cool stuff</a></div>

</footer>
<div id="created">

</div>
<div id="stuff">

</div>

CSS

#created {
    margin: 0 auto;
    width: 100%;
    height: 150px;
    background: green;

}
#stuff {
    margin: 0 auto;
    width: 100%;
    height: 150px;
    background: white;

}

.active {
    color: red;
}

编辑:shows error with non camel casing

最佳答案

因为你调用的函数是scrollIntoView() (in camelCasing) 而定义的函数是scrollintoview()(不是驼峰式)

注意:JavaScript 是一种区分大小写的语言。

确保您以正确的顺序包含了 JavaScript 文件。首先,加载 jQuery 库,然后加载 scrollintoview 插件,最后加载 application.js

编辑:根据评论中的讨论更新了答案。

关于jquery: 错误 $ ("div#created").scrollintoview 不是函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8541018/

相关文章:

jquery - 事件选项卡和js样式

javascript - 单击一次添加文本以输入

javascript - 无论如何隐藏网页上的菜单/标题并在 x 秒后自动显示文本?

html - 如何使用CSS隐藏特定页面上的类

php - 我在将文件移动到我想要的文件夹时遇到问题

javascript - bootstrap中的Input-group div,将其定位到底部

javascript - JS : two click events, JS如何决定哪个先触发

html - 如何使用ffmpeg使html5 webm视频平滑滚动

jquery - 如何使用 CSS(jQuery SVG 图像替换)更改 SVG 图像的颜色?

javascript - 使用 jQuery 验证插件的图像尺寸规则