Question

更新：我从答案中更新了代码，现在正在运行。感谢@Azamantes

我尝试调用父对象/构造函数。

HTML代码：

<div style="width:50px; height: 50px; display: inline-block; background-color:red;" id="id0">BoxId0</div>
<div style="width:50px; height: 50px; display: inline-block; background-color:red;" id="id1">BoxId1</div>
<div style="width:50px; height: 50px; display: inline-block; background-color:red;" id="id2">BoxId2</div>
<div style="width:50px; height: 50px; display: inline-block; background-color:red;" id="id3">BoxId3</div>

Javascript代码：

    function Child(parent, childID) {
            var thisReference = this;
            var parentReference = parent;

            $(childID).on("click", function() {
                parentReference.childCallMe(childID); // Gave on click 'TypeError: parentReference.childCallMe is not a function'
            });

            return {
                getParent() { return parentReference },
                getThis() { return thisReference },
                getChild() { return childID },
            }
        }


        function Mother(childrenCount) {
            var thisReference = this;
            var children = [];
            var testText = "test";

// Will not work:            
function childCallMe(id) {
                alert("mohter: " + id);
            }
// This will work:
this.childCallMe = function(id){ alert('mother' + id) };

            for(var i = 0; i < childrenCount; i++) {
                children[i] = new Child(thisReference, '#id' + i);
            }

            return {
                getTestText() { return testText },
                getThis() { return thisReference },
                getChildren() { return children },
            };
        };
    /*
        Mother.prototype.childCallMe = function(id) {
            alert(id);
            //I need to call a function in Mother
        };
    */

        var mother1 = new Mother(4);

我会重复使用＆＃39;母亲＆＃39;不同HTML元素的次数更多。小孩的数量＆＃39;也可以改变。我想我不清楚如何使用这个上下文。在PHP中，它非常简单。：（

Answer 1

function Child(parent, childID) {
    var thisReference = this;

    $(childID).on("click", function() {
        parent.childCallMe(childID); // Gives 'TypeError: parent.childCallMe is not a function'
    });

    return {
        getThis() { return thisReference },
        getChild() { return childID },
    }
}


function Mother(childrenCount) {
    var thisReference = this;
    var children = [];

    function childCallMe(id) {
        alert(id);
    }

    for(var i = 0; i < childrenCount; i++) {
        children[i] = new Child(this, '#id' + i);
    }

    return { 
        getThis() { return thisReference },
        getChildren() { return children },
    };
};
Mother.prototype.childCallMe = function(id) {
    alert(id);
};

var mother1 = new Mother(4);

所以，在完善你的代码之后，我注意到你没有添加来自母亲'类'的childCallMe方法，因此Child没有看到它，因此错误。

这是最有意义的方式：

function Child(parent, childID) {
    this.id = childID;

    $(childID).on("click", function() {
        parent.childCallMe(childID); // Gives 'TypeError: parent.childCallMe is not a function'
    });
}


function Mother(childrenCount) {
    this.children = [];

    function childCallMe(id) {
        alert(id);
    }

    for(var i = 0; i < childrenCount; i++) {
        this.children[i] = new Child(this, '#id' + i);
    }
};
Mother.prototype.childCallMe = function(id) {
    alert(id);
};

var mother1 = new Mother(4);

从动态创建的子构造函数调用父构造函数

1 个答案: