【问题标题】:jquery: Error $("div#created").scrollintoview is not a functionjquery:错误 $("div#created").scrollintoview 不是函数
【发布时间】:2011-12-16 22:44:44
【问题描述】:

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

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

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

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

原来的 jsfiddle 在哪里工作:http://jsfiddle.net/Gr7BP/

application.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;
}

编辑:

【问题讨论】:

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


    【解决方案1】:

    因为你调用的函数是scrollIntoView()camelCasing),而定义的函数是scrollintoview()不是camelCasing

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

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

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

    【讨论】:

    • 对不起,那不行,我在谷歌搜索后将其更改为骆驼外壳作为最后的手段,发现有些人这样称呼它,只是在发布问题时忘记改回来。很抱歉混淆了,但事实并非如此,并在上面进行了编辑以显示。
    • 你是否在application.js之前加入了scrollintoview插件?
    • 我将它粘贴在我的 application.js 的顶部,但是当我将它单独包含在另一个文件之上时,我得到了一个新的 js 错误,上面写着“Jquery 未定义”并指向第 208 行 @ 987654321@
    • 按什么顺序包含 JavaScript 文件?确保首先包含jQuery,然后是插件,最后是application.js。我没有看到任何其他可能导致此问题的东西。
    • 是的,这是这些文件的顺序,感谢您帮助我完成它,我从不知道它们需要按特定顺序排列。
    【解决方案2】:

    回调函数可能会解决问题。

     $('div#created').scrollintoview({
          duration: "slow",
          direction: "y"
     }, function() {
          // do something   
     });
    

    【讨论】:

      猜你喜欢
      • 2019-04-15
      • 2021-09-22
      • 2011-08-31
      • 1970-01-01
      • 1970-01-01
      • 2014-08-02
      • 2014-03-04
      • 1970-01-01
      相关资源
      最近更新 更多