8

因此，我将所需的每个文件都链接到 index.html 文件中：

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

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

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

脚本.js：

alert(notify.newNotification);

当我尝试访问“script.js”中的“通知”对象时，它工作得很好。但我想使用 jquery，所以我将 $(document).ready() 添加到两个文件中，如下所示：

通知.js

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

脚本.js：

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

在我添加之后，它提出了notify is not defined.What's wrong？谁能解释为什么它不起作用？

4

6 回答 6

8

正如您var notify在 notify.js中定义的那样，$(document).ready(它是一个匿名函数，var notify作用域仅限于此函数。

所以不能在$(document).ready(函数外访问

为了使外部可访问，请不要将其包装在$(document).ready(函数中

像这样：-

var notify;
$(document).ready(function () {
    notify = {
        newNotification: function (text) { }
    }
});
于 2013-10-02T02:23:13.437 回答
2

就像这里的其他人已经指出的那样：仅$().ready在您处理 DOM 元素并且您的变量不可访问时使用，因为您使用了var关键字（就像您应该使用的那样）。var 关键字将定义的变量限制在当前范围内，这是您用作 DOM-Ready-Handler 的匿名函数的范围。

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

但是（！）您应该将代码包装到闭包中，以避免弄乱全局范围并避免与第 3 方代码可能的命名冲突。

像那样：

通知.js

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

脚本.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

通知.js

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

脚本.js

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

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

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

于 2013-10-02T03:11:39.650 回答
0

您的所有 JavaScript 将在文档准备好之前加载。

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

于 2013-10-02T02:32:09.743 回答
0

在这种情况下，无需将通知对象包装在 dom 就绪中...因为从外观上看，您在创建对象时并没有创建任何 dom 元素引用...唯一重要的是处理的任何方法调用使用 dom 元素必须在 dom 就绪时完成。

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

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

如果您在 dom 就绪处理程序中声明该变量，那么它将成为 dom 就绪处理程序的局部变量......因此在 dom 就绪处理程序之外将无法访问它......

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

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

或者

$(document).ready(function () {
    window.notify = {
        newNotification: function (text) {}
    }
})
于 2013-10-02T02:23:54.207 回答
0

您只需要一个 document.ready 而这仅声明将在其脚本中自由移动的变量。

请参阅示例：

脚本.js：

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

通知.js：

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

function otherFunc(txt){
   // your code here
   $.varB = txt;
}
于 2013-10-02T02:26:50.130 回答
-1

尝试这个。

var notify = {
    newNotification : function(text) {
    }
于 2013-10-02T02:27:07.890 回答