在登陆界面实现按回车后登录

概述

主要有三种实现方式

  • 在 <body> 属性中添加代码:
  • 添加 JS 绑定
  • 在定义了 type=submit 按钮标签下,使用 @keyup.enter="submit"

具体实现方式：

一、在<body>属性中添加代码

onkeydown="if(event.keyCode===13) document.all.login.click()"

二、添加JS绑定

<script>
    $(document).keydown(function(event){
        if(event.keyCode==13){
        	// 其中 login 为登录按钮的 id 属性
			// 注 ：id不可重复
            document.getElementById("login").click();
        }
    });
</script>

注意：在使用此方法时，记得提前引用 jQuery

在定义了 type=submit 按钮标签下,使用 @keyup.enter="submit"

For Example:

<button id="login" type="submit" @keyup.enter="submit">登录</button>

在 vue 中， v-on 监听键盘事件时，存在特殊的键盘修饰符

<input v-on:keyup.13="submit">

同时，vue 也可使用常用按键的别名

<input v-on:keyup.enter="submit">
 
<!--简写-->
<input @keyup.enter="submit">

参考链接：
HTML页面实现enter(回车)键自动登录操作

posted @ 2023-08-26 09:50  chenzhang-Blog  阅读(720)  评论(0)    收藏  举报