从正文调用函数时未捕获的 ReferenceError答案

【问题标题】：Uncaught ReferenceError while calling the function from body从正文调用函数时未捕获的 ReferenceError
【发布时间】：2015-02-19 03:18:23
【问题描述】：

我正在尝试解决这个问题，虽然我不是 js 开发人员，而且我的实现有时很蹩脚。

我在外部js中定义了这个函数：

function moveScroller() {
        var move = function() {
            var st = $(window).scrollTop();
            var ot = $("#scroller-anchor").offset().top;
            var s = $("#scroller");
            if(st > ot) {
                s.css({
                    position: "fixed",
                    top: "60px"
                });
            } else {
                if(st <= ot) {
                    s.css({
                        position: "relative",
                        top: ""
                    });
                }
            }
        };
        $(window).scroll(move);
        move();
    }

比在正文中的 html 中我有这个代码：

<div style="width:900px; position:relative; margin:0 auto; border:1px solid red; padding-top:300px; padding-left:60px;">
<div id="scroller-anchor"></div>
<div class="info_holder" id="scroller">Information in here and here</div>

random and random<br /><br /><br /><br /><br />
random and random<br /><br /><br /><br /><br />
random and random<br /><br /><br /><br /><br />
random and random<br /><br /><br /><br /><br />
random and random<br /><br /><br /><br /><br />
random and random<br /><br /><br /><br /><br />
random and random<br /><br /><br /><br /><br />
random and random<br /><br /><br /><br /><br />
random and random<br /><br /><br /><br /><br />
random and random<br /><br /><br /><br /><br />
random and random<br /><br /><br /><br /><br />
random and random<br /><br /><br /><br /><br />
random and random<br /><br /><br /><br /><br />
random and random<br /><br /><br /><br /><br />

</div>
<script>
$(document).ready(function() {
        moveScroller();
    });
</script>

我尝试在没有 $(document).ready 的情况下执行脚本的主体部分，但它给了我同样的错误 Uncaught ReferenceError: moveScroller is not defined。

http://jsfiddle.net/A6gYg/76/ 或 http://atargeta.staging.wpengine.com/modules/ 如果您打开控制台，您应该会看到唯一的错误。

【问题讨论】：

jsFiddle 中的 JS 窗口加载取决于您在左侧下拉列表中选择的内容，当您将其设置为 onLoad 时，该窗口会在 DOM 加载时加载您的函数，这晚于您直接放置在正文中的 DOM 就绪处理程序。只需将函数放在主体中调用它的代码之前的某个位置，最好放在同一个脚本标记中？

标签： javascript jquery

【解决方案1】：

更改您的 javascript 以放置在 <head> 中。这样，一旦您的$(document).ready(); 呼叫发生，它就可用。按照您现在设置的方式，该功能将在您使用后创建。您希望在使用它之前创建它。

It is not a best practice to place javascript in the <head>，但为了举例，将其放在<head> 中将解决您的问题。

【讨论】：

嘿，kavun，谢谢你在那个 jfiddle 上工作。在我的网站上，这种方式很难解决，因为我不想更改定制的付费 wordpress 主题中的任何内容。但我想我必须这样做:)