Question

当我对Cytoscape.cs使用cxtmenu扩展时，上下文菜单在我选择一个选项后不会立即触发它的事件，而是在我选择另一个节点之后。如何在选择选项后立即触发事件？我的计划是提供类似于Google地图的方式查找，其中已选择了源节点，右键单击节点上的上下文菜单提供“到此处的路由”。我使用jquery 3.1.0（仅因为它被声明为cxtmenu的要求），cytoscape.js 2.75和最新的cytoscape-cxtmenu。请参阅问题的最小工作示例：

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
  <script src="http://cytoscape.github.io/cytoscape.js/api/cytoscape.js-latest/cytoscape.min.js"></script><!--2.7.5-->
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
 <script src="https://raw.githubusercontent.com/cytoscape/cytoscape.js-cxtmenu/master/cytoscape-cxtmenu.js"></script>
</head>
<body>
<div id="cy" style="width:100%;height:100vh;"></div>
<script>
var cy = cytoscape({
	container: document.getElementById('cy'),
	elements:
	[
		{data: {id: 'n1'}},
		{data: {id: 'n2'}},
	]
	});

var added = false;

	var defaults = {
	  menuRadius: 100, // the radius of the circular menu in pixels
	  selector: 'node', // elements matching this Cytoscape.js selector will trigger cxtmenus
	  commands: [
			{
				content: 'test',
				select: function(node)
				{
					if(!added)
					{
					console.log('adding edge');
					cy.add({group:"edges", data: {id: 'e1', source: 'n1', target: 'n2'}});
					added=true;
				}
				}
			},
	  ],
	  openMenuEvents: 'cxttap', // cytoscape events that will open the menu (space separated)
	};

var cxtmenuApi = cy.cxtmenu(defaults);

var selectedNode;

cy.on('select',"node",function(event) {selectedNode = event.cyTarget;});

</script>
	</body>
</html>

P.S。：我设法通过使用openMenuEvents: 'cxttapstart taphold'直接触发事件，但是当释放鼠标按下时，菜单会激活菜单。

Cytoscape.js cxtmenu不会在条目选择上触发事件

0 个答案: