问题描述
我正在创建一个具有用于在Django中创建对象的输入网格的Web表单。
I am creating a web form with a grid of inputs for creating objects in Django.
看起来当焦点在下拉菜单上时,向上和向左箭头选择上一个项目,右/右箭头选择下一个项目。
It seems that when the focus is on a drop down menu, the up and left arrows select the previous item and right / down arrows select the next item.
我想使用左/右箭头将焦点向左或向右移动到网格上(有点像excel)。我可以禁用左/右箭头来更改菜单选项(同时保持上/下箭头的功能)?
I would like to use the left / right arrows to move focus left or right on the grid (a bit like excel does). Can I disable the left / right arrows from changing the menu choice, (while keeping the functionality for the up / down arrows)?
推荐答案
p>更改控件的默认行为有时令用户感到沮丧。但是其他时候,用户期望它像excel一样工作,就像你的情况:)
Changing default behavior of controls is sometimes frustrating for users. But other times the user expect it works like excel like in your case :)
你可以这样做:
var selects = document.getElementsByTagName('select');
for (var i = 0; i < selects.length; i++){
selects[i].addEventListener('keydown',function(e){
var key = e.which || e.keyCode;
if(key == 37){
var previousSibling = this.previousSibling;
while(previousSibling && previousSibling.nodeType != 1) {
previousSibling = previousSibling.previousSibling
}
previousSibling.focus();
e.preventDefault();
}else if(key === 39){
var nextSibling = this.nextSibling;
while(nextSibling && nextSibling.nodeType != 1) {
nextSibling = nextSibling.nextSibling
}
nextSibling.focus();
e.preventDefault();
}
})
}
键37 = ,键39是。
e.preventDefault();
防止def您所按的密钥的一个行为。
Key 37 = and key 39 is .e.preventDefault();
prevents the default behaviour of the key you pressed.
这篇关于HTML / Javascript - 从更改下拉菜单选项停止左/右箭头的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!