el-input 中的 TAB键 & ENTER键

使用的是ElementUI，基于Vue2.x

问题一，禁用输入框 TAB键

HTML

在标签 el-input 中绑定 @keydown 事件，并指明点击中TAB键（ASCII码9号）

 <el-input
   @keydown.9.native="disabledTabInput"
 />

JS

将传入的 event 中的 returnValue 设置为 false 即可禁用TAB键功能

 disabledTabInput(e) {
   e.returnValue = false
 }

问题二，ENTER键 切换输入框焦点

HTML

在标签 el-input 中绑定 @keydown 事件，并指明点击中TAB键（ASCII码13号）

 <el-input
   @keydown.13.native="disabledTabInput"
 />

JS

在所有 HTML 标签中设置一个 class，通过 document.getElementsByClassName('...') 获取，并将 DOM 数组存起来

调用方法时需要传入一个当前输入框的序号，通过序号获取到当前所在的输入框

将当前输入框的下一个输入框，调用 focus() 方法获取焦点即可

 checkEnterInput(index) {
   const inputArray = document.getElementsByClassName('...')
   const nextInput = inputArray[index + 1].childNodes
   nextInput[1].focus()  // el-input会多渲染一层，若用的是input，则直接调用focus()即可
 }