在多个脚本中定义的jQuery .ready()中使用相同的变量

假设我有一个链接到两个脚本的HTML:

...   ... 

这两个脚本中的每一个都有自己定义的jQuery的.ready()

general.js:

 jQuery(function() { var foo; $('#btn').click(function() {alert(foo())}); } 

specific.js:

 jQuery(function() { foo = function() {alert("hello")}; $('#btn').click(function() {foo()}); } 

其中#btn是一个按钮元素。

当我点击#btn我希望看到“hello”对话框,但相反,我得到了Uncaught TypeError: undefined is not a function chrome开发人员工具中的Uncaught TypeError: undefined is not a function

我自己的理解是foo应该在click事件访问之前已经分配了函数,而不是未定义。 显然,我的理解是不正确的。 有人可以向我解释为什么它的行为方式如何?

第一个函数里面var声明了“foo”。 因此它是该function的本地,并且在其外部不可见。

你可以通过在第一个“就绪”处理程序之外声明它来使“foo”全局化。

全局变量是不合需要的; 将值保存为元素本身的“数据”值可能更好。

 $(function() { $('#btn').data('foo', 'some value'); $('#btn').click(function() {alert($(this).data('foo'))}); } 

这样,数据就与元素相关联(虽然不直接在DOM对象上; jQuery跟踪内部映射中的值以避免与DOM相关的内存泄漏),并且不会污染全局命名空间。