jquery - 禁用 map 上事件的滚动

Question

找到了一个潜在的解决方案，但似乎不起作用。

$('svg')
  .on("mousewheel.zoom", null)
  .on("DOMMouseScroll.zoom", null) // disables older versions of Firefox
  .on("wheel.zoom", null);

问题是在点击事件时重新绘制 map 。在某些情况下，缩放事件未初始化，但仍会在 SVG 元素上捕获滚动。当滚动被“捕获”时，它会阻止页面滚动(这不是所需的行为)。有没有办法以编程方式禁用滚动事件的捕获以缩放 SVG？

D3 似乎是动态绑定(bind)的，我什至尝试过显式中断绑定(bind)到极端:

$('.map-container, #map, g, svg, d3, div').off('scroll').unbind('scroll').undelegate('scroll');
$(window).off('scroll').unbind('scroll').undelegate('scroll');
$(document).off('scroll').unbind('scroll').undelegate('scroll');

这可能是我对绑定(bind)等基础知识的失败，或者 D3 可能是以一种非常有弹性的方式构建的。

有什么想法吗？ (如果有任何答案请解释一下，这对我来说很好奇!)

Answer 1

解决方案

这是一个正确的优先级并使用 native 函数的问题。

这在通过按钮单击等进行调用时有效。

 $('.myClass').on('click',function() {
   d3.select('#map')
     .on("mousewheel.zoom", null)
     .on("DOMMouseScroll.zoom", null)
     .on("wheel.zoom", null);
 });

我希望这对其他人有帮助!