在 CTRL+MOUSEWHEEL 事件上

Question

我被要求为我们的页面站点实施 ctrl+mousewheel 事件，以便在用户放大或缩小时更改图像偏移。我找到了这个旧答案 Override browsers CTRL+(WHEEL)SCROLL with javascript，并且我也尝试这样做。我下载了 jQuery Mouse Wheel Plugin 用于实施，这是我的代码：

var isCtrl = false;  
       $(document).on('keydown keyup', function(e) {
            if (e.which === 17) {
                isCtrl = e.type === 'keydown' ? true : false;
            }
        }).on('mousewheel', function(e, delta) { // `delta` will be the distance that the page would have scrolled;
            // might be useful for increasing the SVG size, might not
            if (isCtrl) {
                e.preventDefault();
                alert('wheel');
            }
        });

这些事件单独运行良好，但如果我按住 CTRL 按钮并滚动鼠标，则不会触发滚轮事件。有没有人对此有更好的解决方案，或者我做错了什么？

Answer 1

要检查 ctrl 键是否被单击，事件已经提供了一种方法。试试这个：

.on('mousewheel', function(e) { 
    if (e.ctrlKey) {
        e.preventDefault();
        alert('wheel');
    }
});

这也适用于 e.shiftKey、e.altKey 等。我只会监听滚动事件，然后检查 ctrlKey 是否关闭。

Answer 2

Fiddle，为了使其正常工作，您必须先单击 result 框，然后再尝试。

$(window).bind('mousewheel DOMMouseScroll', function(event) 
{
    if(event.ctrlKey == true)
    {
        event.preventDefault();
        if(event.originalEvent.detail > 0) {
             console.log('Down');
         }else {
             console.log('Up');
         }
    }
});

在 CTRL+MOUSEWHEEL 事件上

On CTRL+MOUSEWHEEL event

javascript

jquery

mouseevent

keyboard-events

jquery-events