单个脚本文件中的两个原型引发了这个问题

时间:2013-04-17 11:39:35

标签: javascript jquery

我已经定义了两个原型,每个原型包含不同的功能。

var sfSvgRender = function (element) {

    this.svgLink = "http://www.w3.org/2000/svg";
    this.svgObj = document.createElementNS(this.svgLink, "svg");
    this._rootId = $(element).attr("id");
    this.svgObj.setAttribute('id', this._rootId + '_svg');

};
sfSvgRender.prototype = new (function () {
    this.drawPath = function (options, element) {
        var path = document.createElementNS(this.svgLink, "path");
        $(path).attr(options);
        $(path).appendTo(element);

    },

})();


var sfAxisRender = function (axis) {
    this.currentAxis = axis;
};
sfAxisRender.prototye =new(function(){

    this.drawText=function (options, label, groupEle, svgObj) {
        var text = document.createElementNS(this.svgLink, "text");
        $(text).attr(options);
        $(text).html(label);
        $(text).appendTo(groupEle);
        $(groupEle).appendTo(svgObj);

    }

})();

当为两个对象创建实例时,第一个对象将正常工作(即我们能够访问第一个原型的方法)

但无法访问第二个原型的方法。

this.svgRenderer = new sfSvgRender(this.element);

this.axisRender=new sfAxisRender(XAxis);

this.svgRenderer正常工作。但是axisRender无法正常工作。

1 个答案:

答案 0 :(得分:1)

您在prototype上将prototye误解为sfAxisRender,这就是为什么它不会继承您尝试分配的新原型实例。

function sfSvgRender(element) {
    this.svgLink = "http://www.w3.org/2000/svg";
    this.svgObj = document.createElementNS(this.svgLink, "svg");
    this._rootId = $(element).attr("id");
    this.svgObj.setAttribute('id', this._rootId + '_svg');
}
sfSvgRender.prototype.drawPath = function (options, element) {
    var path = document.createElementNS(this.svgLink, "path");
    $(path).attr(options);
    $(path).appendTo(element);
};

function sfAxisRender(axis) {
    this.currentAxis = axis;
}
sfAxisRender.prototype.drawText = function (options, label, groupEle, svgObj) {
    var text = document.createElementNS(this.svgLink, "text");
    $(text).attr(options);
    $(text).html(label);
    $(text).appendTo(groupEle);
    $(groupEle).appendTo(svgObj);
};