从原型 dom 加载事件内部创建全局对象-解网

问：

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

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

javascript oop prototypejs dom-events unobtrusive-javascript

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

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/

从原型 dom 加载事件内部创建全局对象

Create global Object from inside Prototype dom loaded event

评论

评论