Question

每次单击使用此代码创建的画布时，它总是表示this.element在创建时未定义。我正在显示的图表正在显示，这不是问题。如果我将this.element替换为document.getElementById(id)，则代码将按预期工作。非常感谢任何帮助或解释，谢谢。

function DrawableChart(id){

    // get canvas
    this.element = document.getElementById(id);
    this.ctx = this.element.getContext("2d");

    // set data
    this.data = {...};

    // special options
    this.options = {...};

    // create chart
    this.chart = new Chart(this.ctx).Line(this.data, this.options);

    // updating chart
    this.update = function(e){
        // this is where the error is
        console.log(this.element);
        // this line also causes an error
        var rect = this.element.getBoundingClientRect();
        var x = e.clientX - rect.left;
        var y = e.clientY - rect.top;
    };

    // update when clicked
    this.element.addEventListener('click', this.update);

}

Answer 1

这是update方法和this值的问题。尝试更改以下内容：

this.update = function(e){ /*...*/ };

为：

this.update = function(e){ /*...*/ }.bind(this);

onclick方法中没有JavaScript类属性

1 个答案: