vue登录界面获取input框焦点以及回车响应逻辑

最新推荐文章于 2023-06-14 20:48:11 发布

document_write

最新推荐文章于 2023-06-14 20:48:11 发布

阅读量831

点赞数 1

本文链接：https://blog.csdn.net/document_write/article/details/102821415

版权

// 回车键自动登录
    created: function() {
      const that = this
      document.onkeypress = function(e) {
        var keycode = document.all ? event.keyCode : e.which
        if (keycode === 13) {
          that.$refs.userInput.focus()      //用ref绑定input框 ,这里是用户名,进入页面敲击回车获得焦点
          if (that.loginForm.username) {          // 如果用户名input框有值，敲击回车下一个input框获取焦点，依次类推
            that.$refs.passwordInput.focus()
          }
          if (that.loginForm.password) {
            that.$refs.captchaInput.focus()
          }
         // 如果所有input框都有值，敲击回车触发登录事件
          if (that.loginForm.username && that.loginForm.password && that.loginForm.captcha) {
            that.handleLogin()
          }
        }
      }
    },