Javascript 启用mouseup/mousedown但防止单击行为

我这里有一个数据可视化（第二个）：

如果你点击代表技能领域的圆圈，它会显示具有特定技能的内部绿色圆圈。如果按住代表技能的绿色圆圈，则它们会在释放鼠标时产生动画、增长，然后收缩。但是，如果您只需单击圆圈，它们会变大，但不会恢复到以前的大小（我猜

mousedown

没有注册）-这会导致圆圈每次单击时都会不断变大

---

有没有办法通过d3或Javascript/jQuery防止点击行为？我只想要

mouseup

和

mousedown

我观察到的行为与您描述的不同

• 如果单击一个圆，无论单击多长时间（无论是否按住），它都会返回到原始大小
• 如果反复快速单击圆，则该圆将开始增长，且不会恢复到原始大小
• 如果按住一个圆圈，然后将鼠标移到圆圈外，它会保持粉红色，不会恢复到原来的大小

我认为在（'mouseout'，handler）上附加一个简单的

.on将球体恢复到其原始大小将解决最后一个问题，这是非常突出的问题，以及任何由于移动到外部而错过的
mouseup
事件。您还可以将
mouseup
附加到整个文档（
d3.select（'body'）。on（'mouseup'，handler）
），它将捕获任何此类事件；然后您只需要记录单击的最后一个球体

此外，要修复原始问题，可以通过在
mousedown
事件中添加
e.preventDefault（）
来确保触发
mouseup
事件。这将防止浏览器将快速单击转化为双击或其他事件

讨论这些问题的其他帖子：




看起来您只是在重新应用我看到的d3示例。你所基于的原始示例在哪里？没有一个示例利用点击/鼠标下键行为的循环打包-我自己添加了所有这些，但是原始的非交互式循环打包示例在这里：明白了。我在想这个，我认为它做了一些类似于你所寻求的事情：。我可能对解决这个问题没有帮助，但祝你好运。看看我发送的示例，看起来他们禁用了拖动，就像这样：
p.on（“click.drag”，null）
。可能会有一个等价的
p.on（“click”，null）
click.drag
只是一个
单击
操作，另外标记为
拖动
。这允许将多个“单击”操作附加到特定元素。