使用javascript禁用中键滚动 [英] Disabling middle click scrolling with javascript

问题描述

背景:我正在创建一个类似于 whenisgood.net 的表格，在它具有用于表格元素的单击-拖动切换.当鼠标左键、中键和右键激活 mousedown 事件时，我想调用不同类型的切换代码.

Background: I am creating a table reminiscent of whenisgood.net, in that it has click-n-drag toggling for table elements. I want to call different types of toggling code when the left, middle, and right mouse buttons activate a mousedown event.

通过使用 JQuery，我有了一个良好的开端.

By using JQuery, I'm off to a good start.

$(".togglable").bind("contextmenu", function() {return false;});
$(".togglable").bind("mousedown", function(e){
  e.preventDefault();
  toggle(this, e);
});

在 toggle() 函数中，我可以使用 e.which 来确定点击了哪个按钮.

In the toggle() function I can use e.which to determine what button was clicked.

妙语:我使用 e.preventDefault() 希望它能停止滚动的中间点击默认行为.它没有.如何阻止滚动操作激活?

The punchline: I used e.preventDefault() hoping that it would stop the middle click default behavior of scrolling. It didn't. What can I do to stop the scroll action from activating?

另见使用中键触发 onclick 事件"

推荐答案

目前，我的解决方案是这样的:(更多 jquery！)

Currently, my solution is this: (more jquery!)

$(".togglable").wrap(
  "<a href='javascript:void(0);'
  onclick='return false;'></a>"
);

通过将它包装在一个链接中(通过 jquery wrap)，浏览器认为它是一个链接即使您四处拖动鼠标，也不要在单击中键时滚动.有了这个设置和我的情况，有几个(次要)问题.

By wrapping it in a link (via jquery wrap), browsers think it's a link and don't scroll on middle click, even if you drag your mouse around. With this setup, and my situation, there are a couple (minor) gotchas.

Firefox 将在您单击鼠标中键时打开一个新标签页，但前提是您不拖动.Opera 将在您单击、拖动与否时打开一个新选项卡.这就是为什么我使用 href='javascript:void(0);' 而不是 href='#'--这样客户端的浏览器就不会加载整个页面，只是一个带有奇怪 url 的空白页面.

Firefox will open a new tab when you middle click, but only if you don't drag. Opera will open a new tab when you middle click, drag or not. That's why I used href='javascript:void(0);' instead of just href='#'--so that the client's browser wouldn't load a whole page, just a blank page with a strange url.

但是这个解决方案在 Chrome 和 Safari 上很有效.它适用于 IE8，除了现在当我左键单击并拖动时，它会将指针更改为不能这样做"符号，因为它认为我想将链接拖动到某处.未在旧版 IE 上测试.

But this solution works like a charm on Chrome and Safari. It works well with IE8, except that now when I left-click-n-drag, it changes the pointer to a "can't do that" symbol, since it thinks I want to drag the link somewhere. Untested on older versions of IE.

这篇关于使用javascript禁用中键滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！