需要显示“单击”事件以像EditNode Popup一样操作，而没有保存和取消按钮。仅显示Nodepopup / edgepopup

Question

我有下面示例中的有效代码。

http://visjs.org/examples/network/other/manipulationEditEdgeNoDrag.html

但是我想添加一个“ click”事件以显示节点属性（NodePopUp）和边缘属性。

因此，当我单击一个节点时，NodePopUp应该显示出来，而没有保存和取消按钮。同样适用于EdgePopup。

左图-单击了节点0。但是我应该单击编辑->编辑节点->然后显示节点属性的弹出窗口。

我想跳过这些步骤，当我单击一个节点/边缘时，需要显示相应的节点/边缘弹出窗口，而无需保存和取消按钮。

有人可以给我建议实现这一目标吗？

Answer 1

基本上，您需要处理click event（network.on("click", ...)）并打开弹出窗口（如果您选择引用示例的代码，则可以看到它是通过editNode助手，也可以通过分配document.getElementById('node-operation').innerHTML = "Add Node";；我不得不承认，那里的代码不是很可重用，您可能要看一下图编辑器的my implementation，请参见{ {1}}的帮助者，对于此类事情更可重用）。所以会有类似的东西

config.macros.graph.createEditPopup

（请参阅with just div instead of popup的工作原理）您还需要通过向元素添加/删除network.on("click", function(clickProperties) { var popup = document.querySelector('.my_popup'); // adjust selector to the class/id you use if(clickProperties.nodes.length == 1) // you want this for just one node clicked, right? { var id = clickProperties.nodes[0]; popup.style.display = 'block'; popup.textContent = 'one node selected: '+id; // fill popup input fields etc } else if(clickProperties.nodes.length == 0) { popup.style.display = 'none'; } }) css来处理隐藏和显示保存/取消按钮；或者更好的是，您可以每次都重新创建弹出窗口，以免将其弄乱。您还必须决定如何关闭弹出窗口（可以跳过隐藏“取消”的操作，也可以将其替换为十字形按钮，或者在按esc或单击其他位置单击时关闭...）