You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
72 lines
2.6 KiB
72 lines
2.6 KiB
// 通过绑定输入框的 class 来实现enter 代替 tab 的功能
|
|
/*
|
|
示例:
|
|
import { getKeyUp } from '../../utlis/getKeyUp'
|
|
|
|
created() {
|
|
getKeyUp('enterToTab')
|
|
}
|
|
|
|
*/
|
|
export function getKeyDown(className){
|
|
//当前页面监视键盘输入 onkeyup /onkeydown
|
|
document.onkeydown = function(e) {
|
|
//e.keyCode === 13
|
|
if(e.key == 'Enter'){
|
|
// 阻止文本框的换行
|
|
if(window.event){
|
|
window.event.returnValue = false;
|
|
}else{
|
|
e.preventDefault(); //for firefox
|
|
}
|
|
// 标记当前组件为true
|
|
if(e.target.tagName === 'INPUT'){
|
|
e.target.autofocus = true;
|
|
}else if(e.target.tagName === 'TEXTAREA'){
|
|
e.target.autofocus = true;
|
|
}else{
|
|
e.target.firstChild.autofocus = true;
|
|
}
|
|
// 获取所有需要定位的组件
|
|
let arr = document.querySelectorAll("."+className);
|
|
let index2 = -1;
|
|
arr.forEach((i,index) => {
|
|
if(i.querySelectorAll("input")[0]){
|
|
if(i.querySelectorAll("input")[0].autofocus){
|
|
index2 = index;
|
|
}
|
|
}else if(i.querySelectorAll("textarea")[0]){
|
|
if(i.querySelectorAll("textarea")[0].autofocus){
|
|
index2 = index;
|
|
}
|
|
}else{
|
|
// 暂无其他
|
|
}
|
|
})
|
|
// 超出返回第一个组件
|
|
if(index2 + 1 >= arr.length){
|
|
index2 = -1;
|
|
}
|
|
// 聚焦到下一个组件中
|
|
if(arr[index2 + 1].querySelectorAll("input")[0]){
|
|
if(arr[index2 + 1].querySelectorAll("input")[0].type === 'hidden'){
|
|
arr[index2 + 1].querySelectorAll("input")[0].parentElement.focus();
|
|
}else{
|
|
arr[index2 + 1].querySelectorAll("input")[0].focus();
|
|
}
|
|
}else if(arr[index2 + 1].querySelectorAll("textarea")[0]){
|
|
arr[index2 + 1].querySelectorAll("textarea")[0].focus();
|
|
}else{
|
|
// 暂无其他
|
|
}
|
|
// 重置当前组件为false
|
|
if(e.target.tagName === 'INPUT'){
|
|
e.target.autofocus = false;
|
|
}else if(e.target.tagName === 'TEXTAREA'){
|
|
e.target.autofocus = false;
|
|
}else{
|
|
e.target.firstChild.autofocus = false;
|
|
}
|
|
}
|
|
}
|
|
}
|