12

我在 DAG 中有一个 joint.js 元素，并且希望能够通过单击它来触发一个事件。

我可以用$(selector).click(...)它来做，但我想知道是否有一个joint.js 特定的方式来处理它，因为这可能会更好。我决定作为 onclick 候选的一个事件是 'batch:stop'

我的代码：

 var variable =  new joint.shapes.basic.Rect({
     name : label,
     id: label,
     onclick : function () {alert("hello");},
     size: { width: width, height: height },
     attrs: {
         text: { text: label, 'font-size': letterSize, 'font-family': 'monospace' },
         rect: {
             fill : fillColor, 
             width: width, height: height,
             rx: 5, ry: 5,
             stroke: '#555'
         }   
     }   
 }); 
 variable.on('batch:stop', function (element) {alert(""); toggleEvidence(element.name);});
 return variable;

我应该如何添加 onclick 事件？

4

2 回答 2

26

JointJS 形状是模型，所以你说得对，点击处理程序对它们不起作用。JointJS 论文触发了可能对您有用的事件：

paper.on('cell:pointerdown', 
    function(cellView, evt, x, y) { 
        alert('cell view ' + cellView.model.id + ' was clicked'); 
    }
);

其他事件是：cell:pointerup、cell:pointerdblclick、cell:pointermove。

完整列表可以在这里找到：http: //jointjs.com/api#joint.dia.Paper :events 。

编辑：

从 JointJS v0.9 开始，还有一个cell:pointerclick事件。

于 2013-12-09T15:23:24.017 回答
0

您还可以使用 Backbone 本身将特定事件附加到特定模型。JointJS 只是底层的骨干。

const newElement = new jointjs.shapes.devs.Model({....});
graph.addCell(newElement);

newElement
  .findView(paper)
  .$el.find('.Settings') // this is nested in the model / cell
  .click(() => {
    // do something
  });
于 2019-04-03T14:51:28.663 回答