Question

我的问题是：

我有一个MouseWheel事件（来自插件：https://github.com/brandonaaron/jquery-mousewheel）触发一个函数：

$(document).on('mousewheel', onMouseWheel);

function onMouseWheel(event,delta)
{ Code... }

我还有一个触发另一个功能的滚动事件：

$(document).on('scroll', onScroll);

function onScroll()
{ Code... }

然而，当使用mouswheel时，两个事件都被触发，因此两个函数都会运行，我不希望它们运行。它们必须是分开的，因为使用鼠标滚轮并拖动滚动条应该给出单独的结果。这个问题只发生在那边。拖动滚动条不会触发鼠标滚轮功能。

编辑：

我已经意识到有一点帮助，问题就出现了，因为我在mousewheel函数中使用了ScrollLeft（），这当然会导致滚动事件。

我试图想出一个解决方案，但没有运气。有人可以帮忙吗？谢谢！

编辑：更多代码：

$(document).on('scroll', onScroll );

            function onScroll()
            {
                code...
            }


            $(document).on('mousewheel', onMouseWheel ) );

            function onMouseWheel(event,delta)
            {
                event.preventDefault(); 

                if(delta<0)
                {       
                    detectDown();       
                }

                else if(delta>0)
                {
                    detectUp();
                }

                return false;   
            }


            $(document).on("keydown", onKeyDown);

            function onKeyDown(e)
            {
                event.preventDefault();

                if (e.keyCode == 37) 
                { 
                    detectUp();
                }
                else if (e.keyCode == 39)
                {
                    detectDown();   
                }

            }


            function detectUp()
            {
                $("html, body").animate({scrollLeft:(currentElement.prev().position().left - 100)}, 800, 'easeOutQuad'); 
                currentElement = currentElement.prev();
            }

            function detectDown()
            {
                $("html, body").animate({scrollLeft:(currentElement.next().position().left - 100)}, 800, 'easeOutQuad'); 

            }

也许这有帮助？

Answer 1

在return false功能的末尾添加onMouseWheel。

function onMouseWheel(event, delta) {
  // code
  return false;
}

这将禁用'mousewheel'事件的默认滚动操作，因此不会触发'scroll'事件。

fiddle

Answer 2

我已经意识到，最好的解决方案是制作自定义滚动条。这样我们就可以避免调用滚动功能并使不同类型的滚动相互干扰。

鼠标滚轮事件和滚动事件相互冲突

2 个答案: