Question

所以我将所需的每个文件链接到index.html文件中：

    <script src="jquery.js"></script>
    <script src="notify.js"></script>
    <script src="script.js"></script>

我在'notify.js'中创建了一个对象：

    var notify = {
    newNotification : function(text) {
    }
}

script.js：

alert(notify.newNotification);

当我尝试访问'script.js'中的'notify'对象时，它工作正常。但我想使用jquery所以我将$（document）.ready（）添加到这两个文件中：

notify.js

    $(document).ready (
    function() {
var notify = {
    newNotification : function(text) {
    }
}
}
)

的script.js：

    $(document).ready (
    function() {
alert(notify.newNotification);
    }
)

在我添加之后，它出现了未定义的通知。出了什么问题？谁能解释为什么它不起作用？

Answer 1

正如您在var notify内的notify.js中定义了$(document).ready(这是一个匿名函数而var notify范围仅限于此函数。

因此无法在$(document).ready(函数

之外访问它

要在外部访问，请不要将其包含在$(document).ready(函数

中像这样： -

var notify;
$(document).ready(function () {
    notify = {
        newNotification: function (text) { }
    }
});

Answer 2

就像其他人已经指出的那样：在处理DOM-Elements时只使用$().ready，因为您使用var关键字（就像您应该这样），您的变量无法访问。 var关键字将定义的变量限制为当前作用域，这是您用作DOM-Ready-Handler的匿名函数的作用域。

因此，删除不必要的$().read将暂时解决您的问题。

但是（！）你应该将你的代码包装成一个闭包，以避免搞乱全局范围并避免与第三方代码发生可能的命名冲突。

就像那样：

notify.js

;(function ($, window, undefined) {
  var notify = {
    newNotification : function(text) {
      return text;
    }
  };
})(jQuery, this);

的script.js

;(function ($, window, undefined) {
  alert(notify.newNotification());
})(jQuery, this);

所以，现在你遇到了和以前一样的问题，你无权访问你的对象。

当然，您可以将您的notify对象添加到全球范围，正如Arun P Johny在他的回答中所建议的那样，但我很确定当时会有更多的对象需要全局访问。如果将它们中的每一个放在全局范围内，则会再次开始弄乱全局范围，因此我的建议是一个全局对象，它将保存您需要全局访问的所有其他对象/变量。（或者甚至更好地使用requirejs

之类的东西

有些想法：

main.js

;var MyApp = {}; # Only variable in global scope

# Maybe some more initalization code here, dunno

notify.js

;(function ($, window, undefined) {
  MyApp.notify = {
    newNotification : function(text) {
      return text;
    }
  };
})(jQuery, this);

的script.js

;(function ($, window, undefined) {
  alert(MyApp.notify.newNotification());
})(jQuery, this);

有关stackoverflow的范围和闭包的一些有趣的问答：

关于搞乱全球范围的一个好答案：

What is meant by “leaking” into global scope?

Answer 3

在这种情况下，不需要将通知对象包装在dom中...因为从它的外观来看，你在创建对象时没有创建任何dom元素引用...唯一重要的是任何方法处理dom元素的invokation必须在dom准备就绪。

var notify = {
    newNotification: function (text) {}
}

$(document).ready(function () {
    notify.newNotification()
})

如果你在dom ready处理程序中声明变量，那么它就成为dom ready处理程序的局部变量...所以它不能在dom ready处理程序之外访问...

另一种解决方案是将变量添加到dom就绪句柄中的全局范围，如

var notify;
$(document).ready(function () {
    notify = {
        newNotification: function (text) {}
    }
})

或

$(document).ready(function () {
    window.notify = {
        newNotification: function (text) {}
    }
})

Answer 4

您只需要一份文件这只会声明在脚本中自由移动的变量。

参见示例：

的script.js：

$(document).ready(function(){
   // declare the variables as global
   $.varA, $.varB, $.varC;
});

notify.js：

function doNotify(){
   // your code here
   $.varA = /*your code here */
}

function otherFunc(txt){
   // your code here
   $.varB = txt;
}

Answer 5

在文档准备好之前，将加载所有JavaScripts。

在script.js中创建一个引用notify对象的单独函数，然后从$(document).ready

调用该函数

Answer 6

试试这个。

var notify = {
    newNotification : function(text) {
    }

无法访问另一个javascript文件中的变量

6 个答案: