函数未定义:必须在同一文件中定义javascript函数吗?

函数未定义:必须在同一文件中定义javascript函数吗?,javascript,jquery,html,requirejs,undefined-reference,Javascript,Jquery,Html,Requirejs,Undefined Reference,我有一个文件notifications.js,其中包含一个绑定到元素的事件,还有一个函数updateNotification()。当JSON对象作为参数传递时,此函数使用jQuery更新页面上的某些元素 问题: 我试图在页面内调用此函数(通过标记),但是它没有调用它,反而会破坏页面。我在Chrome开发者控制台中进行了一些挖掘(不确定名称),并标记了一个错误: /pleaseshare/views/install/:50 Uncaught ReferenceError:updateNotific

我有一个文件
notifications.js
,其中包含一个绑定到元素的事件,还有一个函数
updateNotification()
。当JSON对象作为参数传递时,此函数使用jQuery更新页面上的某些元素

问题:

我试图在页面内调用此函数(通过
标记),但是它没有调用它,反而会破坏页面。我在Chrome开发者控制台中进行了一些挖掘(不确定名称),并标记了一个错误:

/pleaseshare/views/install/:50 Uncaught ReferenceError:updateNotification is not defined
但是,当我在控制台中平移时,我可以清楚地看到脚本下列出的文件
notifications.js
,函数在那里定义。如果我在当前范围内定义函数(例如,调用上方的行),它可以正常工作

我尝试过的

该函数包含一些需要jQuery的javascript,因此我尝试将它封装在
$(document).ready(function(){})中,也尝试不封装它,两者似乎都没有任何影响

我被难住了

为了更好地衡量,这里有一个链接显示我的javascript和html的结构:


如果您能帮助我们弄清为什么会发生这种情况,或者解释为什么javascript函数不能跨文件调用(尽管我希望不是这样),我们将不胜感激;)

函数不能被调用,除非它是在同一个文件中定义的,或者是在尝试调用它之前加载的文件中定义的


函数不能被调用,除非它与试图调用它的函数在相同或更大的范围内


您的代码看起来结构应该可以工作,但显然是一个简化的测试用例,已经简化到无法工作的程度。

您需要将脚本导入页面:


这需要添加到上面调用
updateNotification()

函数的
标记不需要在同一文件中声明。事实上,避免将每个声明转储到全局名称空间通常是JavaScript中的一个问题

在您提供的链接中的示例代码中,
updateNotification
被声明为全局,因此不应该存在范围问题

但是,在同一个示例中,没有显示包含notifications.js。您需要使用
元素导入它,并且该元素必须位于包含对
更新通知的调用的script元素之前。您还必须在notifications.js之前包含jQuery,因为它使用jQuery。所以你需要一些类似的东西:

<body>
    // One or two elements
    <script type="text/javascript"
            src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

    <script type="text/javascript" src="notifications.js"></script>

    <script type="text/javascript">
        $(document).ready( function() {
            var json = {status : 'ok', message: 'Hello'};
            updateNotification(json);
        });
    </script>
    // All other elements
</body>

//一个或两个元素
$(文档).ready(函数(){
var json={status:'ok',message:'Hello'};
更新化(json);
});
//所有其他要素

让它工作起来了。这个问题肯定是多方面的,但我发现了

首先,RequireJS的使用对
updateNotification()
产生了影响,因为它不能跨文件调用,因此被认为是未定义的。我假设这是因为RequireJS是如何加载文件的,稍后我将查看文档(如果发现任何相关内容,请发表一篇编辑文章)

其次,
updateNotification()
如果将其封装在jQuery的DOM ready loader
$(document.ready(function(){})
,则再次被认为未定义。但是
updateNotification()
包含需要jQuery的执行,因此我必须将函数的内容封装在
$(document).ready(function(){})

这是RequireJS/jQuery所特有的一个问题,因此为什么在大多数用例中不会出现这种情况


旁注:标签经过编辑以反映这一点。

您是否正在将所有必需的文件加载到页面中?是的,我是-那么它应该可以工作了。也许检查一下您需要的文件是否实际加载?我应该让自己更清楚一些,抱歉:)。我在上面导入它(在
标记之间),我想每个人都会从“但是,当我在控制台内平移时,我可以清楚地看到脚本下列出的文件notifications.js,函数在那里定义。如果我在当前范围内定义函数(例如,调用上方的行),它可以正常工作。”@Avicinnian您是否验证了javascript文件没有出现404错误?没有,它加载正常。我将尝试跨文件调用一些其他函数,看看会发生什么。我想这可能是我使用的
require.js
库,因为我尝试通过它包含一个Google Chart API javascript文件,我认为它已加载,但在另一个文件中调用它时,它的函数不起作用。看看这个,这显示了我对
的完整标记,其中包括了-Hmm:/。你有没有可能进一步解释一下你所说的简化测试用例是什么意思,它已经被简化到结构无法工作的地步?@Avicinnian-复制/粘贴你的测试用例将无法工作,因为你已经用模糊的注释替换了一堆代码,并且在传输到平面文件时丢失了目录结构。