jointjs - 如何区分节点单击和超链接文本单击jointjs中的元素

Question

var el1 = new joint.shapes.custom.ElementLink({    
position: { x: 80, y: 80 },    
size: { width: 170, height: 100 },    
attrs: {    
rect: { fill: '#E67E22', stroke: '#D35400', 'stroke-width': 5 },    
a: { 'xlink:href': 'http://jointjs.com', 'xlink:show': 'new', cursor: 'pointer' },    
text: { text: 'Element as a link:\nhttp://jointjs.com', fill: 'white' }    

}

});

我想要一个锚标记的处理程序，我可以从我的视图模型中调用任何事件

Answer 1

这取决于你到底想要什么。如果您使用的joint.shapes.custom.ElementLink是本教程中的：http: //jointjs.com/tutorial/hyperlinks，则定义此形状以使其完全包裹在<a>锚标记中，因此单击元素内的任意位置将跟随链接。但是，您可以捕获点击事件，例如，根据事件的目标或其他条件决定您是要点击链接还是做其他事情：

paper.on('cell:pointerclick', function(cellView, evt, x, y) {
    // evt.target contains the SVG subelement that was the target of the click
    // cellView is the view for the joint.shapes.custom.ElementLink cell model
    // cellView.model is the cell model
    if (someCondition) {
        // This is how you can prevent the default browser action which is
        // following the <a> link.
        evt.preventDefault();
    }
})