Question

我想在DOM加载后创建一个可全局访问的对象。我的方法是使用原型dom：loaded event并实例化Object。

JavaScript代码：

document.observe("dom:loaded", function() {

    var globalPAO = new picArrayObject();
    alert(globalPAO.picArray[0]); // alerts [object HTMLDivElement]
});

var picArrayObject = function () {

    var myPic1 = document.getElementById('pic1');
    var myPic2 = document.getElementById('pic2');
    var myPic3 = document.getElementById('pic3');

    function construct() {
        this.picArray = [myPic1,myPic2,myPic3];
    }

return new construct();
}

myTrigger.onClick = function () {

    alert(globalPAO.picArray[0]); // alerts nothing
}

亲自尝试：http://jsfiddle.net/vEGXH/2

Answer 1

我看到的三件事：

您必须在"dom:loaded"处理程序中分配单击处理程序，否则ID trigger的元素可能尚不存在（实际上，这是错误控制台中显示的错误在Safari中：

TypeError：表达式'myTrigger'[null]的结果不是对象。

）。
使用return new construct()似乎过于复杂。
var globalPAO创建本地变量。如果省略var，则创建一个全局的。

改进示例：

document.observe("dom:loaded", function() {

    globalPAO = new picArrayObject();
    alert(globalPAO.picArray[0]); // alerts [object HTMLDivElement]

    var myTrigger = document.getElementById('trigger');
    myTrigger.onclick = function () {
        alert(globalPAO.picArray[0]); // alerts object HTMLDivElement]
    }
});

var picArrayObject = function () {

    var myPic1 = document.getElementById('pic1');
    var myPic2 = document.getElementById('pic2');
    var myPic3 = document.getElementById('pic3');

    this.picArray = [myPic1,myPic2,myPic3];
}

亲自尝试：http://jsfiddle.net/vEGXH/4/

Answer 2

为什么不把它放在窗口？

，例如window.globalPAO = new picArrayObject();，您可以在脚本的任何位置将其用作globalPAO

JavaScript：从Prototype dom加载事件中创建全局Object

2 个答案: