最近开发一个大屏项目,需要按住左键对画布进行拖拽,但是由于在画布需要框选元素已经占用了左键的功能,所以产品提出在按住空格键 + 左键的情况下对画布进行拖拽的需求。我们知道空格键是有它的默认事件的。如果鼠标光标在输入框(这里指input、textarea等)内,敲击空格键的作用是在输入框内增加一个空格;如果鼠标光标不在输入框内,那么敲击空格键则会滚动滚动条(如果有滚动条的话)。那么我的需求就是:如果鼠标在输入框内,敲击空格键就有默认事件;如果鼠标光标不在输入框内,则阻止掉空格键的默认事件;以下是详细代码:
function keydown(e) {
if (e.keyCode === 32) {
// 如果鼠标不在输入框内,禁用掉空格键的默认事件(控制滚动条)
if (e.target.nodeName !== "TEXTAREA" && e.target.nodeName !== "INPUT") {
e.preventDefault();
}
}
}