在拖动事件的函数内访问'this'

时间:2016-06-23 12:59:02

标签: javascript jquery this

我有一个拖动事件的代码:

BusinessProductFigure.prototype = new Figure();
BusinessProductFigure.prototype.constructor = BusinessProductFigure;
BusinessProductFigure.prototype.addTo = function(c, x0, y0, id) {
console.log("this=",this);
var n = d3.select(this);
var wasMoved = false;
var dragger = d3.behavior.drag()
    .origin(function(d){return d;})
    .on("drag", this.move)
    .on("dragend", dropHandler)

this.move 函数在上面的代码中执行并执行它的指定函数。但是,我想添加一个在拖动事件上调用的函数。我尝试了以下方法:

BusinessProductFigure.prototype.addTo = function(c, x0, y0, id) {
console.log("this=",this);
var n = d3.select(this);
var wasMoved = false;
var dragger = d3.behavior.drag()
    .origin(function(d){return d;})
    .on("drag", function(){wasMoved=true; this.move})
    .on("dragend", dropHandler)

但上面的代码并没有调用move函数。如何在函数中访问“this”属性?

2 个答案:

答案 0 :(得分:2)

您可以使用bind()绑定相关上下文,并使用parenthensis来调用方法:

.on("drag", function(){wasMoved=true; this.move()}.bind(this))

答案 1 :(得分:1)

另一种解决方案,因为2016年已经使用arrow function来保留词汇背景:

.on("drag", () => {
   wasMoved = true;
   this.move()
})