停止从冒泡滑动到 body

Question

我有一个图片轮播和一个图片库灯箱，它们都允许用户滑动浏览照片。但是，整个 body 页面上还有一个滑动事件，用于打开侧面板。

我已尝试在 child 画廊元素上使用以下代码，但滑动事件仍然冒泡到页面的 body 并打开面板。

如果有人知道我做错了什么，非常感谢任何建议！

$('.lightbox, .carousel').bind('swipeLeft swipeRight', function(event) {
    event.stopPropagation();
    event.preventDefault();
    event.stopImmediatePropagation();
});

这是fiddle.

Answer 1

JavaScript is a case-sensitive language. This means that language keywords, variables, function names, and any other identifiers must always be typed with a consistent capitalization of letters. The while keyword, for example, must be typed "while", not "While" or "WHILE". Similarly, online, Online, OnLine, and ONLINE are four distinct variable names.

Source

您需要使用 swipeleft 和 swiperight（注意不是大写 L 或 R）。但是，您的菜单打开绑定中的大小写正确。

$('.carousel').bind('swipeleft swiperight', function(event) {
    event.stopPropagation();
});

JSFIDDLE

停止从冒泡滑动到 body

Stop swipe from bubbling to body

jquery

event-bubbling

swipe

preventdefault

stoppropagation