javascript - 停止拖动事件的传播

标签 javascript events leaflet

如何停止拖动事件的传播?

目前我的当前代码看起来像这样:

map.on('drag', function(e) {
    e.originalEvent.preventDefault();
    e.originalEvent.stopPropagation();
    console.log('event');
    return false;
});

事件已正确触发,因为我可以在我的控制台中看到日志,但尽管调用了 preventDefaultstopPropagation, map 仍被拖动,知道吗?

最佳答案

编辑以反射(reflect)评论中的建议

停止拖动事件的传播不起作用,即

map.on('drag', function(e) {
     $(this).dragging.disable();
     return false;
});

OP 试图防止在 map 上拖动,除非是 2 根手指拖动。为了实现这一点,建议用透明的 div 覆盖 map ,然后在触发双指手势事件时隐藏 div。像...

HTML

<div class='map-container'>
    <div class='overlay' style='width:100%; hwight:100%; background-color:transparent;'>
    </div>
    <div class='map'>
    </div>
</div>

JS/Jquery

$('.overlay').on('touchstart', function (e) {
if (e.touches.length > 1)
    $(this).hide();
});

$('.overlay').on('touchend', function (e){
    $(this).show();
});  

关于javascript - 停止拖动事件的传播,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51675476/

相关文章:

python - 从Python中的folium map 中删除滚动条

javascript - SoundCloud 小部件事件未触发

java - 为什么我的 JavaFX slider 事件没有触发?

c++ - 状态机设计处理数据输入

html - 为什么 Chrome 的 img 元素的 onerror 事件只触发一次?

javascript - 不用ajax读取geoJson

javascript - 一旦实例引用丢失,则编辑或删除BreezeJS EntityManager

javascript - Vue.js 在 v-for 循环中访问嵌套对象

javascript - AngularJs:在不同的组/表单/div 中使用 TAB 键进行键盘导航

javascript - Leaflet L.geoJSON 可拖动