4

有没有办法在不使用的情况下访问事件目标（DOM 元素）this？我在一个对象内部，我想this绑定到对象本身。全局d3.event显然不存储目标 -d3.event.target不起作用。有什么线索吗？

编辑：这是我正在运行的代码（它是咖啡脚本）：

@nodes = @svg.selectAll('g.node')
  .data(@nodes, (d) -> d.key)
  .enter()
  .append('g')
  .attr('class', 'node')
  .attr('transform', (d) => "translate(#{@x d.x},#{@y d.y})")
@nodes.append('svg:rect')
  .attr('width', @x 100)
  .attr('height', @y 50)

node_drag = d3.behavior.drag().origin(Object).on('drag', @drag_move)
@nodes.call node_drag


drag_move: (d, i) ->
  console.log d3.event.target

浏览器控制台输出是

function e(){this.on("mousedown.drag",t).on("touchstart.drag",t)}

如果我添加一条debugger语句并手动检查对象，也是一样。由于某种原因d3.event.target返回一个函数而不是事件对象。

4

2 回答 2

2

我通过在 dragmove 函数中重置 d3.event.target 的值解决了这个问题：

d3.event.target = event.target;

然后 d3.event.target 成为目标 DOM 元素，代替像 drag() 这样的函数...

于 2015-01-27T16:11:05.947 回答
0

我可以重新创建它，并且我很想它应该被记录为一个错误 - 我认为将拖动控件本身传递为d3.event.target.

在这种情况下，修复似乎很容易 - 只需调用rect选择的拖动行为即可：

@rect = @nodes.append('svg:rect')
  .attr('width', @x 100)
  .attr('height', @y 50)

node_drag = d3.behavior.drag().origin(Object).on('drag', @drag_move)
@rect.call node_drag

但是，如果您的节点组中有多个元素并且想了解哪些被拖动，我会觉得这很烦人。

于 2012-10-18T20:04:48.127 回答